67
Art Everywhere: progetto per workshop Google. Sviluppo di sistemi di pattern recognition per la similarità tra opere d’arte e di algoritmi di com- pressione e trasferimento efficiente di immagini Dipartimento di Ingegneria Informatica, Automatica e Gestionale A. Ruberti, Università di Roma “La SapienzaCorso di Laurea in Ingegneria Informatica e Automatica Candidato Francesco Cucari Matricola 1535743 Relatore Prof. Stefano Leonardi Anno Accademico 2014/2015

Art Everywhere: progetto per workshop Google. Sviluppo di sistemi di pattern recognition per la similarità tra opere d'arte e di algoritmi di compressione e trasferimento efficiente

Embed Size (px)

Citation preview

Art Everywhere progetto per workshop GoogleSviluppo di sistemi di pattern recognition per lasimilaritagrave tra opere drsquoarte e di algoritmi di com-pressione e trasferimento efficiente di immagini

Dipartimento di Ingegneria Informatica Automatica e Gestionale A RubertiUniversitagrave di Roma ldquoLa Sapienzardquo

Corso di Laurea in Ingegneria Informatica e Automatica

Candidato

Francesco CucariMatricola 1535743

Relatore

Prof Stefano Leonardi

Anno Accademico 20142015

Art Everywhere progetto per workshop Google Sviluppo di sistemi di pat-tern recognition per la similaritagrave tra opere drsquoarte e di algoritmi di compressionee trasferimento efficiente di immaginiTesi di Laurea Sapienza ndash Universitagrave di Roma

copy 2015 Francesco Cucari Tutti i diritti riservati

Questa tesi egrave stata composta con LATEX e la classe Sapthesis

Email dellrsquoautore francescocucarigmailcom | cucari1535743studentiuniroma1it

Ai miei genitoriche mi hanno insegnato la strada

Ai miei fratelliche mi spingono ad andare oltre

iv

Indice

Introduzione vi

1 Requisiti 111 Specifica dei requisiti 112 Screenshots delle principali funzionalitagrave 2

2 Tecnologie e metodologie usate 321 Tecnologie in uso 3

211 Google App Engine 3212 Google Cloud Endpoints 3213 Google Cloud Datastore 4214 Picasa Web Albums Data API 5215 Android 5216 Python 5217 OAuth 20 6218 Flask 6219 PythonAnywhere 72110 OpenCV 7

22 Tecnologie abbandonate 7221 Google BlobStore API 7222 Google Cloud Storage 8

23 Metodologia utilizzata ed organizzazione del lavoro 8231 Milestones 8232 Divisione del lavoro 9233 Tool utilizzati 9

3 Analisi concettuale del sistema 1031 Modello Entitagrave-Relazioni 10

311 Vincoli non esprimibili nello schema 10312 Glossario delle entitagrave e delle relazioni 11313 Ristrutturazione dello schema ER 12

32 Use Case Diagram 15321 Carica opera drsquoarte 15322 Ricerca opera drsquoarte 16323 Visualizza galleria delle opere 16

Indice v

4 Progettazione del sistema 1741 Architettura del sistema 1742 Progettazione logica del data layer 18

421 Schema logico dei dati 18422 Ristrutturazione dello schema logico 19

5 Realizzazione del sistema 2351 Upload immagini 23

511 Sequence diagram 23512 Implementazione 24513 Aspetti particolari 27

52 Algoritmo di compressione immagini Whatsapp-like 27521 Stato dellrsquoarte 27522 Metodo proposto e implementazione 28523 Risultati ottenuti 31

53 Pattern recognition per similaritagrave tra opere drsquoarte 32531 Stato dellrsquoarte 32532 Metodo proposto e implementazione 33533 Risultati ottenuti 39

54 Download immagini 41541 Sequence diagram 41542 Implementazione 41543 Aspetti particolari 45

6 Distribuzione e Validazione 4661 Installazione applicazione 4662 Validazione 47

621 User-Centered Design 47622 Risultati sondaggi 48

A Appendice Immagini 55A1 Immagini per test di compressione 55A2 Opere drsquoarte 56A3 Immagini di ricerca 57

Ringraziamenti 58

vi

Introduzione

Il presente progetto di tesi egrave il frutto di un lavoro di gruppo svolto durante ilworkshop Google Technologies for Cloud and Web Development1 che ha portatoalla luce Art Everywhere un social network in cui gli artisti emergenti possonofarsi conoscere e condividere le proprie opere drsquoarteSi tratta di unrsquoapplicazione Android nata per soddisfare il bisogno di migliaiadi artisti emergenti di promuovere la propria arte in uno spazio completamentededicato a loro in cui egrave possibile venire a contatto con altri artisti critici eappassionati drsquoarte Questi possono giudicare tramite un like commentare econdividere le opere drsquoarte degli artisti registrati sulla piattaforma

Il workshop durato 5 mesi (Dicembre 2014 - Aprile 2015) egrave stato organiz-zato dallrsquoUniversitagrave La Sapienza in collaborazione con Google Tel Aviv e ha visto lapartecipazione di studenti delle tre universitagrave di Roma (La Sapienza Tor Vergata eRoma Tre) Gli studenti partecipanti sono stati divisi in gruppi ciascuno dei qualiha dovuto realizzare un progetto ovvero la progettazione e lo sviluppo di un sistemaweb live Si egrave trattato di un workshop incentrato sul cloud e sul web developmentutilizzando principalmente ma non esclusivamente strumenti e tecnologie diGoogle Il workshop ha previsto revisioni periodiche del progetto nelle quali egrave statopresentato lo stato di avanzamento del lavoro ed egrave stato valutato dallo staff e daimentors del workshop Al termine di esso il progetto ha ricevuto una valutazionefinale di 99100 Inoltre Art Everywhere ha ricevuto una menzione speciale duranteil keynote Entrepreneurship at scale di Yossi Matias (Vice Presidente di Google eAmministratore Delegato del centro RampD Google Israele) durante la conferenzainternazionale WWW2015 Entrepreneurs Track2 tenutasi a Firenze nel mese diMaggio 2015

Il gruppo che ha lavorato ad Art Everywhere egrave composto da 5 componentie ciascuno ha sviluppato una o piugrave funzionalitagrave che ha approfondito nella propriarelazione al progetto

Lrsquoobiettivo del mio progetto di tesi egrave quello di mostrare gli algoritmi usatiper il trasferimento (uploaddownload) efficiente delle opere drsquoarte cioegrave di immaginie per la loro compressione prevenendo una perdita significativa della qualitagrave eottenendo cosigrave un comportamento simile allrsquoalgoritmo di compressione immagini

1httpssitesgooglecomadisuniroma1itgoogle-technologies-for-cloud-and-web-development2httpwwwet2015org

vii

usato da WhatsappInoltre viene presentato il sistema realizzato per il riconoscimento di patternfinalizzato ad individuare similaritagrave tra le opere drsquoarte presenti nel database e conopere drsquoarte famose in modo da individuare falsi drsquoautore e prevenire eventualifurti di proprietagrave intellettuale

Struttura della tesiPer concludere la parte introduttiva diamo per ogni capitolo una breve sintesi

Capitolo 1 Viene presentata una descrizione completa e dettagliata della realtagrave diinteresse che mette in evidenza quali sono i dati che il sistema deve gestiree quali sono le principali funzionalitagrave includendo per alcune di esse unoscreenshot

Capitolo 2 Vengono mostrate le tecnologie adottate nel progetto soffermandosiin particolare su quelle innovative (ovvero non presentate nei corsi universi-tari) e su quelle in uso e specificando le motivazioni che ci hanno spinto adabbandonarne alcune Inoltre viene presentata la metodologia utilizzata nellaconduzione del progetto

Capitolo 3 Viene approfondita la conoscenza del dominio di interesse in manieratale da poter descrivere in modo preciso e completo cosa questo progetto deverealizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

Capitolo 4 Si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedelepossibile allo schema ER di partenza e che sia al tempo stesso efficiente

Capitolo 5 Viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inoltre ci si sofferma maggiormentesullo sviluppo degli algoritmi usati per il trasferimento efficiente e per lacompressione di immagini prevenendo una significativa perdita di qualitagraveInfine viene presentato il sistema realizzato per il riconoscimento di patterntra opere drsquoarte finalizzato ad individuare similaritagrave tra opere drsquoarte

Capitolo 6 Vengono date indicazioni su come installare lrsquoapplicazione e si descrivecome egrave stata effettuata la validazione e la fase di test dellrsquoapplicazione

1

Capitolo 1

Requisiti

In questo capitolo viene effettuata la raccolta e lrsquoanalisi dei requisti procedendoquindi alla definizione delle proprietagrave e delle funzionalitagrave del sistema Viene prodottauna descrizione completa e dettagliata dei dati che il sistema deve gestire e delleoperazioni da effettuare su di essi Infine vengono illustrati alcuni screenshots delleprincipali funzionalitagrave del sistema

11 Specifica dei requisitiSi vuole progettare lo schema concettuale corrispondente allrsquoapplicazione nella qualeinteressa memorizzare lrsquoemail di ogni utente Ogni utente puograve essere un visitatore(ed in tal caso non interessa memorizzare alcuna proprietagrave aggiuntiva) o un artistaper il quale si vuole memorizzare il nome il cognome unrsquoimmagine di profilo edeventualmente un nickname il suo sito la sua biografia e lrsquoeventuale id dellrsquoimmaginedi profilo (in caso essa venga sostituita) Egrave di interesse per lrsquoapplicazione memorizzareinformazioni sulle opere drsquoarte caricate dagli artisti Nello specifico interessano lrsquourldella immagine il suo identificativo di caricamento la data e ora di caricamentoil titolo ed eventualmente una descrizione il luogo in cui egrave stata realizzata e lesue dimensioni Si vuole anche memorizzare lrsquoemail dellrsquoartista che ha caricatolrsquoopera Si vogliono anche memorizzare le tecniche pittoriche delle quali interessamemorizzare il nome (univoco) e che sono identificate per mezzo di una chiavenumerica Ogni opera drsquoarte caricata deve necessariamente specificare il tipo ditecnica pittorica utilizzata Le opere drsquoarte possono ricevere apprezzamenti e critichesotto forma di likes e commenti Di ogni like memorizzato interessa sapere chi egravelrsquoartista che lo ha apposto lrsquoopera drsquoarte coinvolta e la data e ora in cui esso egravestato apposto Per ogni opera drsquoarte egrave di interesse memorizzare anche il numerodi like Ogni commento egrave identificato da un codice numerico e di esso interessa iltesto del commento la data e ora in cui esso egrave stato apposto lrsquoutente che lo haapposto e lrsquoopera drsquoarte coinvolta Opere drsquoarte e commenti possono essere giudicatidagli artisti registrati come inappropriati A tale scopo egrave possibile segnalare uncommento o unrsquoopera drsquoarte e della segnalazione interessa sapere qual egrave il contenutocoinvolto lrsquoartista segnalante e lrsquoutente segnalato Ogni artista puograve segnalare uncerto contenuto unrsquounica volta Inoltre si vuole tenere traccia degli utenti che acausa delle segnalazioni ricevute sono finiti sulla ldquolista nerardquo dellrsquoapplicazione e

12 Screenshots delle principali funzionalitagrave 2

che non possono piugrave utilizzarla Di una entry della lista nera interessa sapere chi egravelrsquoutente coinvolto In particolare un utente visitatore finisce in lista nera alla primasegnalazione ricevuta mentre un utente artista finisce in lista nera solo dopo cheavendo valutato le segnalazioni ricevute si ritiene che esso debba essere inserito inessa A tale scopo per lrsquoartista si memorizza una proprietagrave aggiuntiva che tieneconto della gravitagrave dello storico delle segnalazioni precedenti

12 Screenshots delle principali funzionalitagrave

Figura 11 Galleria principale Figura 12 Profilo Artista

Figura 13 Dettaglio Opera Figura 14 Commenti

3

Capitolo 2

Tecnologie e metodologie usate

In questo capitolo verranno presentate le principali tecnologie utilizzate specificandole funzionalitagrave delle tecnologie attualmente in uso e le motivazioni che ci hannospinto ad abbandonare alcune tecnologie In seguito verragrave presentata la metodologiautilizzata nella conduzione del progetto durante il periodo del workshop Google e larelativa organizzazione del lavoro tra i componenti del gruppo

21 Tecnologie in uso

211 Google App Engine

Google App Engine1 (GAE) egrave una Platform as a Service (PaaS) che consente dicreare ed eseguire applicazioni web sullrsquoinfrastruttura di Google GAE offre unascalabilitagrave automatica per le applicazioni a seconda del numero di richieste drsquousoper quella applicazione ed alloca in automatico piugrave risorse per gestire la doman-da addizionale Le applicazioni vengono eseguite in un ambiente sandbox sicuropermettendo la distribuzione delle richieste su piugrave server e la scalabilitagrave dei serverper soddisfare le richieste di traffico GAE supporta app scritte in una varietagrave dilinguaggi di programmazione come Java Python PHP e GoPer lo sviluppo di Art Everywhere si egrave scelto utilizzare il linguaggio di programma-zione Python e quindi di realizzare una Python web app che rappresenta il backenddellrsquoapplicazione

212 Google Cloud Endpoints

Google Cloud Endpoints2 (GCE) egrave un insieme di strumenti librerie e funzionalitagraveche consentono di generare API e librerie client da unrsquoapplicazione GAE (backend)per semplificare lrsquoaccesso client ai dati da altre applicazioni GCE utilizza la libreriaGoogle Protocol RPC un protocollo per lrsquoinvocazione remota di procedure HTTP-based Egrave possibile definire un servizio RPC in una singola classe Python che contieneun certo numero di metodi remoti dichiarati Ogni metodo remoto accetta un insiemespecifico di parametri come richiesta e restituisce una risposta specifica Questiparametri di richiesta e di risposta sono le classi definite dallrsquoutente note come

1httpscloudgooglecomappengine2httpscloudgooglecomappenginedocsjavaendpoints

21 Tecnologie in uso 4

Tabella 21 Parametri accettati da un metodo remoto

Request Message Class La classe del messaggio di richiesta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Response Message Class La classe del messaggio di risposta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Name Nome alternativo al metodoPath Il percorso URI da usare per accedere al

metodoHttp method Il metodo HTTP da usare (GET POST

ecc)

messaggi (ProtoRPC Messages) La Tabella 21 mostra i parametri accettati daimetodi remotiDopo aver completato la creazione dei vari metodi egrave possibile auto-generare lelibrerie per il client e quindi da importare nellrsquoapplicazione mobile Nel caso diArt Everywhere le librerie sono scritte in Java dato che si egrave scelto di realizzareunrsquoapplicazione Android Per autogenerare le librerie per il client egrave necessario usareil seguente comando da linea di comando

google_appengineendpointscfgpy ltcommandgt lttarget_langgt ltoptionsgt[class-name]

bull ltcommandgt puograve essere get_client_lib o get_discovery_doc

bull lttarget_langgt (usato solo con get_client_lib) specifica il tipo di pacchettoche si desidera creare Si egrave tenuti ad inserire il valore java per i client Javacome Android

bull ltoptiongt se fornito indica una o piugrave opzioni disponibili Ad esempio build-system specifica il tipo di bundle da produrre Si egrave tenuti a specificare gradleper i client Android

bull [class name] egrave il nome completo della classe

213 Google Cloud Datastore

Google Cloud Datastore3 (GCD) fornisce lrsquoarchiviazione dei dati senza richiedereuno schema fisso (NoSQL) garantendo una memorizzazione robusta e scalabile perle applicazioniA differenza dei tradizionali database relazionali GCD utilizza unrsquoarchitetturadistribuita per gestire automaticamente la scalabilitagrave fino a grandi insiemi di datiPoicheacute tutte le query sono servite da indici predefiniti i tipi di query che possonoessere eseguite sono piugrave restrittive rispetto a quelle consentite su un databaserelazionale con SQL In particolare non sono supportate le seguenti operazioni

3httpscloudgooglecomdatastoredocsconceptsoverview

21 Tecnologie in uso 5

join disuguaglianza di filtraggio su piugrave proprietagrave filtraggio dei dati sulla base deirisultati di una subqueryGCD salva gli oggetti di dati come entitagrave Unrsquoentitagrave ha una o piugrave proprietagrave icui valori possono essere uno dei diversi tipi di dati supportati per esempio unaproprietagrave puograve essere una stringa un numero intero o un riferimento ad unrsquoaltraentitagrave Ogni entitagrave egrave identificato dal suo genere che categorizza lrsquoentitagrave al fine dipoter effettuare query e una chiave che la identifica in modo univoco allrsquointerno delsuo genere

In Art Everywhere abbiamo utilizzato Python NDB Datastore API per po-ter definire modelli allrsquointerno di unrsquoapplicazione App Engine Un modello egrave unaclasse Python che agisce come una sorta di schema di database descrive un tipo didati in termini di proprietagrave

Nel capitolo 3 verragrave approfondita lrsquoanalisi concettuale del progetto che porteragrave alladefinizione del modello della base di dati utilizzata

214 Picasa Web Albums Data API

Le API di Picasa Web Albums consentono a siti web e applicazioni mobili di integrarsicon Picasa un software grafico per organizzare e modificare fotografie digitali evideo e di condividerle con altri utenti nei ldquoweb albumrdquoArt Everywhere memorizza tutte le immagini caricate dagli utenti su Picasa WebAlbums Usando lrsquoaccount Google dellrsquoapplicazione tutte le immagini (inviate daldispositivo mobile) vengono memorizzate dal backend in un web album chiamatoldquoArt Everywhererdquo e accessibile a chiunque tramite URL Tali URL vengono memo-rizzate nel database come una proprietagrave (url) della entitagrave PictureEntryDa App Engine lrsquoupload delle immagini su Picasa Web Album viene effettuatousando la libreria Google Data Python

215 Android

Android4 egrave un sistema operativo per dispositivi mobili sviluppato da Google Incbasato su kernel Linux e distribuito sotto i termini della licenza Apache 20 checonsente di modificare e distribuire liberamente il codice sorgentePer lo sviluppo di Art Everywhere egrave stato utilizzato Android Studio lrsquoIDE ufficialeper lo sviluppo di applicazioni Android basato su IntelliJ Idea e si egrave scelto di renderedisponibile lrsquoapplicazione a partire dalla versione sdk 15+ ovvero compatibile apartire dalla versione Android 40 (Ice Cream Sandwich)

216 Python

Python5 egrave un linguaggio di programmazione orientato agli oggetti e utilizzabile permolti tipi di sviluppo software Ersquo stato utilizzato per la realizzazione del backenddi Art Everyhwere sottoforma di una Python web app che interagisce con il web

4httpsitwikipediaorgwikiAndroid5httpswwwpythonorg

21 Tecnologie in uso 6

server GAE usando il protocollo WSGI6 In particolare egrave stato utilizzato webapp2un framework WSGI compatibile che consente di creare rapidamente sempliciapplicazioni web per il runtime di Python 27 Infatti la Python web app vieneeseguita da GAE utilizzando il linguaggio pre-caricato Python in un ambiente sicurosandbox Si tratta di un ambiente Python puro lrsquointerprete Python puograve eseguirequalsiasi codice Python ma non puograve caricare moduli Python che contengono codiceC

Inoltre in Art Everywhere il linguaggio di programmazione Python egrave statoutilizzato per codificare lrsquoalgoritmo di pattern recognition utilizzando la libreriaOpenCV (2110) il framework web Flask (218) e caricando il codice sul servizio dihosting PythonAnywhere (219)

217 OAuth 20

OAuth 20 egrave un protocollo aperto che garantisce ai service provider lrsquoaccesso daparte di terzi ai dati degli utenti proteggendo contemporanemente le loro credenzialiErsquo utilizzato dalle API di Google (ad esempio effettuare il login usando lrsquoaccountGoogle) per lrsquoautenticazione e le autorizzazioni e tutte le applicazioni seguono unpattern quando si accede ad un API di Google usando OAuth 20

bull ottenere le credenziali dalla Google Developer Console7 cioegrave il clientID e client secret che sono noti solamente a Google e alla propria applicazione

bull ottenere un token di accesso dal Server delle Autorizzazioni di Goo-gle prima che lrsquoapplicazione possa accedere ai dati privati tramite un API diGoogle si deve ottenere un token di accesso che concede lrsquoaccesso a tale APIUn parametro variabile di nome scope controlla lrsquoinsieme di risorse e delle ope-razioni che un token di accesso permette Se lrsquoutente concede lrsquoautorizzazioneil Server delle Autorizzazioni Google invia allrsquoapplicazione un token di accessoSe lrsquoutente non concede lrsquoautorizzazione il server restituisce un errore

bull inviare token di accesso ad uno specifico API in un header HTTP diautorizzazione

bull aggiornare il token di accesso se necessario poichegrave hanno una duratalimitata

218 Flask

Flask8 egrave un framework web scritto in Python e basato sullo strumento Werkzeug(libreria di utilitagrave HTTP e WSGI per Python) e con il motore template Jinja2 Flaskviene chiamato microframework percheacute non forza uno sviluppatore ad utilizzare un

6httpsitwikipediaorgwikiWeb_Server_Gateway_Interface Il Web Server Gateway In-terface (WSGI) egrave un protocollo di trasmissione che stabilisce e descrive comunicazioni ed interazionitra server ed applicazioni web scritte nel linguaggio Python Egrave quindi lrsquointerfaccia standard del webservice per la programmazione in Python

7httpsconsoledevelopersgooglecom8httpflaskpocooorgdocs010

22 Tecnologie abbandonate 7

particolare strumento o una libreria Non ha alcun livello di astrazione del databasela validazione dei form o qualsiasi altro componente in cui librerie di terze partipre-esistenti forniscono funzioni comuniIn Art Everywhere Flask egrave stato usato per realizzare unrsquoapplicazione web contenentelrsquoalgoritmo di pattern recognition per la similaritagrave tra immagini (53) e permetterecosigrave richieste RESTful effettuate dal backend

219 PythonAnywhere

PythonAnywhere9 egrave un servizio di hosting Web basato sul linguaggio di program-mazione Python Le applicazioni web ospitate possono essere scritte utilizzandoqualsiasi applicazione basata su framework WSGI con Art Everywhere abbiamoutilizzato Flask

2110 OpenCV

OpenCV10 egrave una libreria open source per software di computer vision e machinelearning OpenCV egrave stato realizzato per fornire una infrastruttura comune perapplicazioni di computer vision La libreria dispone metodi che possono essereutilizzati per rilevare e riconoscere i volti umani identificare oggetti classificare leazioni umane nei video tracciare movimenti di macchine su pista estrarre modelli3D di oggetti seguire i movimenti degli occhi riconoscere scenari eccDispone di interfacce C++ C Python Java e MATLAB e supporta WindowsLinux Android e Mac OS

In Art Everywhere tale libreria egrave stata utilizzata per realizzare lrsquoalgoritmodi pattern recognition per la similaritagrave tra immagini (53) utilizzando lrsquointerfacciaPython in ambiente Linux

22 Tecnologie abbandonate

221 Google BlobStore API

BlobStore API11 consente alle applicazioni di servire oggetti di dati chiamati blobche sono molto piugrave grandi della dimensione consentita per oggetti nel servizioDatastore come ad esempio i file video o immagini Blobs sono creati caricandoun file tramite una richiesta HTTP e cosigrave Blobstore crea un blob dal contenuto delfile e restituisce un riferimento per il blob chiamato blob key che potragrave poi essereutilizzato per servire il blobQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Per poter scrivere un blob direttamente sul Datastore egrave necessario lrsquoutilizzodi una low-level API messa a disposizione da Google Files API Essa perograve

9httpswwwpythonanywherecom10httpopencvorg11httpscloudgooglecomappenginedocsjavablobstore

23 Metodologia utilizzata ed organizzazione del lavoro 8

egrave stata deprecata da Google12 in favore dellrsquoutilizzo del solo Google CloudStorage il quale offre un servizio di scrittura file-like similare

bull Google Cloud Datastore offre uno spazio di archiviazione limitato per lrsquoarchi-viazione dei blobs (5GB di spazio free) che si sarebbe saturato facilmente seavessimo scelto di caricare le immagini direttamente su di esso

222 Google Cloud Storage

Google Cloud Storage13 egrave un servizio Internet per memorizzare i dati nel cloud diGoogleQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Spazio di archiviazione free inferiore rispetto a quello offerto da Picasa (5GBdi spazio offerti da GCS contro i 15GB di spazio gratuito offerti da GoogleDrive e di conseguenza messi a disposizione per Picasa)

bull Maggiore efficienza nellrsquoupload riscontrata nei test effettuati

23 Metodologia utilizzata ed organizzazione del lavoro

231 Milestones

Il workshop Google Technologies for Cloud and Web Development nel quale egrave statorealizzato il progetto Art Everywhere ha previsto delle milestones intermedieovvero dei momenti di verifica del progetto nei quali egrave stato presentato lo stato diavanzamento del lavoro ed egrave stato valutato dallo staff e dai mentors del workshop

Per la prima milestone (Gennaio 2015) ci siamo concentrati sullo studiodelle tecnologie utilizzate per sviluppare un Minimum Viable Product con lo scopodi presentare e testare le principali caratteristiche dellrsquoapplicazione In particolareabbiamo sviluppato lrsquoUpload delle immagini e la Galleria principale usata permostrare le opere caricate dagli artisti

Per la seconda milestone (Febbraio 2015) ci siamo focalizzati sui feedbackricevuti nella precedente e sui bisogni dei nostri utenti (gli artisti) sottoponendo unsondaggio a piugrave di 50 artisti Sono state aggiunte altre caratteristiche come la Paginadellrsquoartista il Dettaglio opera e i Filtri di ricerca opere La Release Candidate egravestata testata da 10 utenti I risultati dei sondaggi sono stati presentati nel Capitolo 6

Lo scopo della terza milestone (Marzo 2015) era quello di presentare lrsquointe-ro progetto funzionante Lrsquoapplicazione egrave stata completata realizzando la partesocial (Likes Commenti e Condivisione) migliorando lrsquoUser Interface adottando ilMaterial Design e lrsquousabilitagrave dellrsquoapplicazione attraverso dei sondaggi condotti suun campione di utenti

12httpscloudgooglecomappenginedocspythongooglestorage13httpscloudgooglecomstoragedocsoverview

23 Metodologia utilizzata ed organizzazione del lavoro 9

La quarta milestone (Aprile 2015) rappresentava la Final Submission ovve-ro la presentazione del progetto davanti ad una giuria composta oltre che dallostaff del workshop da ingegneri Google Allrsquoapplicazione sono state aggiunte lapossibilitagrave di modificareeliminare unrsquoopera drsquoarte modificareaggiornare il profilodellrsquoartista segnalare un commento o unrsquoopera offensiva e visualizzare la lista dellepersone che hanno messo un Like ad unrsquoopera

232 Divisione del lavoro

Il progetto egrave stato realizzato come lavoro di gruppo durante il workshop GoogleTechnologies for Cloud and Web Development e la suddivisione del lavoro egrave derivatadallrsquoarchitettura three-tier usata come riferimento ovvero interfaccia utente logicafunzionale (business logic) e gestione dei dati persistenti Ciascuno ha poi svi-luppato una o piugrave funzionalitagrave che ha approfondito nella propria relazione al progetto

Il mio personale contributo che viene presentato in queste pagine ha ri-guardato gli algoritmi usati per il trasferimento (uploaddownload) efficiente delleopere drsquoarte ovvero di immagini e per la loro compressione prevenendo unaperdita significativa della qualitagrave Inoltre viene presentato il sistema realizzatoper il riconoscimento di pattern finalizzato ad individuare similaritagrave tra le operedrsquoarte presenti nel database e con opere drsquoarte famose in modo da individuare falsidrsquoautore e prevenire eventuali furti di proprietagrave intellettuale

233 Tool utilizzati

Per coordinare il lavoro abbiamo utilizzato GitHub14 un servizio web di hosting perlo sviluppo di progetti software che ci ha permesso di creare una repository15 perpoter condividere il codice del progetto e lavorare cosigrave simultaneamente Inoltreabbiamo ritenuto molto utile la funzione Issues che rappresenta un ottimo modoper tenere traccia delle attivitagrave miglioramenti e bug del progetto

Abbiamo effettuato revisioni continue circa ogni 23 giorni con lo scopo diverificare lrsquoavanzamento del lavoro in base alle milestones fissate Ciograve egrave avvenutotramite incontri fisici o tramite il servizio di messaggistica istantanea e VoIPHangout16 Google Drive17 egrave stato utilizzato per lrsquoarchiviazione e lo scambio didocumenti condivisi come ad esempio immagini documentazioni diagrammidellrsquoarchitettura e di progettazioneecc Survio18 egrave un software online per crearegratuitamente questionari e sondaggi ed egrave cosigrave stato utilizzato per sottoporre iquestionari presentati nel Capitolo 6 Infine abbiamo utilizzato Android Studio19lrsquoIDE ufficiale per lo sviluppo di applicazioni Android e PyCharm20un ambiente disviluppo per la programmazione Python

14httpsgithubcom15httpsgithubcomdavideaurucciArtEverywhere16httpwwwgooglecom+learnmorehangouts17httpdrivegooglecom18httpwwwsurviocomit19httpsdeveloperandroidcomsdkindexhtml20httpswwwjetbrainscompycharm

10

Capitolo 3

Analisi concettuale del sistema

In questo capitolo viene approfondita la conoscenza del dominio di interesse inmaniera tale da poter descrivere in modo preciso e completo cosa tale progettodeve realizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

31 Modello Entitagrave-Relazioni

LikeEntry

PictureEntryArtistEntry

FlagEntry

TechniqueEntry

CommentEntry

BlacklistEntry

CommentFlag PictureFlag FlaggedPicture

FlaggedComment

PictureParent

CommentBy CommentParent

PictureTechnique

Figura 31 Schema ER dellrsquoapplicazione

311 Vincoli non esprimibili nello schema

Non sono esprimibili nello schema i seguenti vincoli esterni

bull Vincolo sul numero segnalazioni di Visitor forall v isin Istanze(IVisitor)esiste al piugrave un fd isin Istanze(IFlagged) con fd = ltUserv FlagEntryfgt

bull Vincolo sullrsquoattributo likes forall p isin Istanze(IPictureEntry) sia I = ltPictu-reEntryp ArtistEntry agt isin Istanze(ILikeEntry) | a isin Istanze(IArtistEntry)

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

Art Everywhere progetto per workshop Google Sviluppo di sistemi di pat-tern recognition per la similaritagrave tra opere drsquoarte e di algoritmi di compressionee trasferimento efficiente di immaginiTesi di Laurea Sapienza ndash Universitagrave di Roma

copy 2015 Francesco Cucari Tutti i diritti riservati

Questa tesi egrave stata composta con LATEX e la classe Sapthesis

Email dellrsquoautore francescocucarigmailcom | cucari1535743studentiuniroma1it

Ai miei genitoriche mi hanno insegnato la strada

Ai miei fratelliche mi spingono ad andare oltre

iv

Indice

Introduzione vi

1 Requisiti 111 Specifica dei requisiti 112 Screenshots delle principali funzionalitagrave 2

2 Tecnologie e metodologie usate 321 Tecnologie in uso 3

211 Google App Engine 3212 Google Cloud Endpoints 3213 Google Cloud Datastore 4214 Picasa Web Albums Data API 5215 Android 5216 Python 5217 OAuth 20 6218 Flask 6219 PythonAnywhere 72110 OpenCV 7

22 Tecnologie abbandonate 7221 Google BlobStore API 7222 Google Cloud Storage 8

23 Metodologia utilizzata ed organizzazione del lavoro 8231 Milestones 8232 Divisione del lavoro 9233 Tool utilizzati 9

3 Analisi concettuale del sistema 1031 Modello Entitagrave-Relazioni 10

311 Vincoli non esprimibili nello schema 10312 Glossario delle entitagrave e delle relazioni 11313 Ristrutturazione dello schema ER 12

32 Use Case Diagram 15321 Carica opera drsquoarte 15322 Ricerca opera drsquoarte 16323 Visualizza galleria delle opere 16

Indice v

4 Progettazione del sistema 1741 Architettura del sistema 1742 Progettazione logica del data layer 18

421 Schema logico dei dati 18422 Ristrutturazione dello schema logico 19

5 Realizzazione del sistema 2351 Upload immagini 23

511 Sequence diagram 23512 Implementazione 24513 Aspetti particolari 27

52 Algoritmo di compressione immagini Whatsapp-like 27521 Stato dellrsquoarte 27522 Metodo proposto e implementazione 28523 Risultati ottenuti 31

53 Pattern recognition per similaritagrave tra opere drsquoarte 32531 Stato dellrsquoarte 32532 Metodo proposto e implementazione 33533 Risultati ottenuti 39

54 Download immagini 41541 Sequence diagram 41542 Implementazione 41543 Aspetti particolari 45

6 Distribuzione e Validazione 4661 Installazione applicazione 4662 Validazione 47

621 User-Centered Design 47622 Risultati sondaggi 48

A Appendice Immagini 55A1 Immagini per test di compressione 55A2 Opere drsquoarte 56A3 Immagini di ricerca 57

Ringraziamenti 58

vi

Introduzione

Il presente progetto di tesi egrave il frutto di un lavoro di gruppo svolto durante ilworkshop Google Technologies for Cloud and Web Development1 che ha portatoalla luce Art Everywhere un social network in cui gli artisti emergenti possonofarsi conoscere e condividere le proprie opere drsquoarteSi tratta di unrsquoapplicazione Android nata per soddisfare il bisogno di migliaiadi artisti emergenti di promuovere la propria arte in uno spazio completamentededicato a loro in cui egrave possibile venire a contatto con altri artisti critici eappassionati drsquoarte Questi possono giudicare tramite un like commentare econdividere le opere drsquoarte degli artisti registrati sulla piattaforma

Il workshop durato 5 mesi (Dicembre 2014 - Aprile 2015) egrave stato organiz-zato dallrsquoUniversitagrave La Sapienza in collaborazione con Google Tel Aviv e ha visto lapartecipazione di studenti delle tre universitagrave di Roma (La Sapienza Tor Vergata eRoma Tre) Gli studenti partecipanti sono stati divisi in gruppi ciascuno dei qualiha dovuto realizzare un progetto ovvero la progettazione e lo sviluppo di un sistemaweb live Si egrave trattato di un workshop incentrato sul cloud e sul web developmentutilizzando principalmente ma non esclusivamente strumenti e tecnologie diGoogle Il workshop ha previsto revisioni periodiche del progetto nelle quali egrave statopresentato lo stato di avanzamento del lavoro ed egrave stato valutato dallo staff e daimentors del workshop Al termine di esso il progetto ha ricevuto una valutazionefinale di 99100 Inoltre Art Everywhere ha ricevuto una menzione speciale duranteil keynote Entrepreneurship at scale di Yossi Matias (Vice Presidente di Google eAmministratore Delegato del centro RampD Google Israele) durante la conferenzainternazionale WWW2015 Entrepreneurs Track2 tenutasi a Firenze nel mese diMaggio 2015

Il gruppo che ha lavorato ad Art Everywhere egrave composto da 5 componentie ciascuno ha sviluppato una o piugrave funzionalitagrave che ha approfondito nella propriarelazione al progetto

Lrsquoobiettivo del mio progetto di tesi egrave quello di mostrare gli algoritmi usatiper il trasferimento (uploaddownload) efficiente delle opere drsquoarte cioegrave di immaginie per la loro compressione prevenendo una perdita significativa della qualitagrave eottenendo cosigrave un comportamento simile allrsquoalgoritmo di compressione immagini

1httpssitesgooglecomadisuniroma1itgoogle-technologies-for-cloud-and-web-development2httpwwwet2015org

vii

usato da WhatsappInoltre viene presentato il sistema realizzato per il riconoscimento di patternfinalizzato ad individuare similaritagrave tra le opere drsquoarte presenti nel database e conopere drsquoarte famose in modo da individuare falsi drsquoautore e prevenire eventualifurti di proprietagrave intellettuale

Struttura della tesiPer concludere la parte introduttiva diamo per ogni capitolo una breve sintesi

Capitolo 1 Viene presentata una descrizione completa e dettagliata della realtagrave diinteresse che mette in evidenza quali sono i dati che il sistema deve gestiree quali sono le principali funzionalitagrave includendo per alcune di esse unoscreenshot

Capitolo 2 Vengono mostrate le tecnologie adottate nel progetto soffermandosiin particolare su quelle innovative (ovvero non presentate nei corsi universi-tari) e su quelle in uso e specificando le motivazioni che ci hanno spinto adabbandonarne alcune Inoltre viene presentata la metodologia utilizzata nellaconduzione del progetto

Capitolo 3 Viene approfondita la conoscenza del dominio di interesse in manieratale da poter descrivere in modo preciso e completo cosa questo progetto deverealizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

Capitolo 4 Si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedelepossibile allo schema ER di partenza e che sia al tempo stesso efficiente

Capitolo 5 Viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inoltre ci si sofferma maggiormentesullo sviluppo degli algoritmi usati per il trasferimento efficiente e per lacompressione di immagini prevenendo una significativa perdita di qualitagraveInfine viene presentato il sistema realizzato per il riconoscimento di patterntra opere drsquoarte finalizzato ad individuare similaritagrave tra opere drsquoarte

Capitolo 6 Vengono date indicazioni su come installare lrsquoapplicazione e si descrivecome egrave stata effettuata la validazione e la fase di test dellrsquoapplicazione

1

Capitolo 1

Requisiti

In questo capitolo viene effettuata la raccolta e lrsquoanalisi dei requisti procedendoquindi alla definizione delle proprietagrave e delle funzionalitagrave del sistema Viene prodottauna descrizione completa e dettagliata dei dati che il sistema deve gestire e delleoperazioni da effettuare su di essi Infine vengono illustrati alcuni screenshots delleprincipali funzionalitagrave del sistema

11 Specifica dei requisitiSi vuole progettare lo schema concettuale corrispondente allrsquoapplicazione nella qualeinteressa memorizzare lrsquoemail di ogni utente Ogni utente puograve essere un visitatore(ed in tal caso non interessa memorizzare alcuna proprietagrave aggiuntiva) o un artistaper il quale si vuole memorizzare il nome il cognome unrsquoimmagine di profilo edeventualmente un nickname il suo sito la sua biografia e lrsquoeventuale id dellrsquoimmaginedi profilo (in caso essa venga sostituita) Egrave di interesse per lrsquoapplicazione memorizzareinformazioni sulle opere drsquoarte caricate dagli artisti Nello specifico interessano lrsquourldella immagine il suo identificativo di caricamento la data e ora di caricamentoil titolo ed eventualmente una descrizione il luogo in cui egrave stata realizzata e lesue dimensioni Si vuole anche memorizzare lrsquoemail dellrsquoartista che ha caricatolrsquoopera Si vogliono anche memorizzare le tecniche pittoriche delle quali interessamemorizzare il nome (univoco) e che sono identificate per mezzo di una chiavenumerica Ogni opera drsquoarte caricata deve necessariamente specificare il tipo ditecnica pittorica utilizzata Le opere drsquoarte possono ricevere apprezzamenti e critichesotto forma di likes e commenti Di ogni like memorizzato interessa sapere chi egravelrsquoartista che lo ha apposto lrsquoopera drsquoarte coinvolta e la data e ora in cui esso egravestato apposto Per ogni opera drsquoarte egrave di interesse memorizzare anche il numerodi like Ogni commento egrave identificato da un codice numerico e di esso interessa iltesto del commento la data e ora in cui esso egrave stato apposto lrsquoutente che lo haapposto e lrsquoopera drsquoarte coinvolta Opere drsquoarte e commenti possono essere giudicatidagli artisti registrati come inappropriati A tale scopo egrave possibile segnalare uncommento o unrsquoopera drsquoarte e della segnalazione interessa sapere qual egrave il contenutocoinvolto lrsquoartista segnalante e lrsquoutente segnalato Ogni artista puograve segnalare uncerto contenuto unrsquounica volta Inoltre si vuole tenere traccia degli utenti che acausa delle segnalazioni ricevute sono finiti sulla ldquolista nerardquo dellrsquoapplicazione e

12 Screenshots delle principali funzionalitagrave 2

che non possono piugrave utilizzarla Di una entry della lista nera interessa sapere chi egravelrsquoutente coinvolto In particolare un utente visitatore finisce in lista nera alla primasegnalazione ricevuta mentre un utente artista finisce in lista nera solo dopo cheavendo valutato le segnalazioni ricevute si ritiene che esso debba essere inserito inessa A tale scopo per lrsquoartista si memorizza una proprietagrave aggiuntiva che tieneconto della gravitagrave dello storico delle segnalazioni precedenti

12 Screenshots delle principali funzionalitagrave

Figura 11 Galleria principale Figura 12 Profilo Artista

Figura 13 Dettaglio Opera Figura 14 Commenti

3

Capitolo 2

Tecnologie e metodologie usate

In questo capitolo verranno presentate le principali tecnologie utilizzate specificandole funzionalitagrave delle tecnologie attualmente in uso e le motivazioni che ci hannospinto ad abbandonare alcune tecnologie In seguito verragrave presentata la metodologiautilizzata nella conduzione del progetto durante il periodo del workshop Google e larelativa organizzazione del lavoro tra i componenti del gruppo

21 Tecnologie in uso

211 Google App Engine

Google App Engine1 (GAE) egrave una Platform as a Service (PaaS) che consente dicreare ed eseguire applicazioni web sullrsquoinfrastruttura di Google GAE offre unascalabilitagrave automatica per le applicazioni a seconda del numero di richieste drsquousoper quella applicazione ed alloca in automatico piugrave risorse per gestire la doman-da addizionale Le applicazioni vengono eseguite in un ambiente sandbox sicuropermettendo la distribuzione delle richieste su piugrave server e la scalabilitagrave dei serverper soddisfare le richieste di traffico GAE supporta app scritte in una varietagrave dilinguaggi di programmazione come Java Python PHP e GoPer lo sviluppo di Art Everywhere si egrave scelto utilizzare il linguaggio di programma-zione Python e quindi di realizzare una Python web app che rappresenta il backenddellrsquoapplicazione

212 Google Cloud Endpoints

Google Cloud Endpoints2 (GCE) egrave un insieme di strumenti librerie e funzionalitagraveche consentono di generare API e librerie client da unrsquoapplicazione GAE (backend)per semplificare lrsquoaccesso client ai dati da altre applicazioni GCE utilizza la libreriaGoogle Protocol RPC un protocollo per lrsquoinvocazione remota di procedure HTTP-based Egrave possibile definire un servizio RPC in una singola classe Python che contieneun certo numero di metodi remoti dichiarati Ogni metodo remoto accetta un insiemespecifico di parametri come richiesta e restituisce una risposta specifica Questiparametri di richiesta e di risposta sono le classi definite dallrsquoutente note come

1httpscloudgooglecomappengine2httpscloudgooglecomappenginedocsjavaendpoints

21 Tecnologie in uso 4

Tabella 21 Parametri accettati da un metodo remoto

Request Message Class La classe del messaggio di richiesta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Response Message Class La classe del messaggio di risposta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Name Nome alternativo al metodoPath Il percorso URI da usare per accedere al

metodoHttp method Il metodo HTTP da usare (GET POST

ecc)

messaggi (ProtoRPC Messages) La Tabella 21 mostra i parametri accettati daimetodi remotiDopo aver completato la creazione dei vari metodi egrave possibile auto-generare lelibrerie per il client e quindi da importare nellrsquoapplicazione mobile Nel caso diArt Everywhere le librerie sono scritte in Java dato che si egrave scelto di realizzareunrsquoapplicazione Android Per autogenerare le librerie per il client egrave necessario usareil seguente comando da linea di comando

google_appengineendpointscfgpy ltcommandgt lttarget_langgt ltoptionsgt[class-name]

bull ltcommandgt puograve essere get_client_lib o get_discovery_doc

bull lttarget_langgt (usato solo con get_client_lib) specifica il tipo di pacchettoche si desidera creare Si egrave tenuti ad inserire il valore java per i client Javacome Android

bull ltoptiongt se fornito indica una o piugrave opzioni disponibili Ad esempio build-system specifica il tipo di bundle da produrre Si egrave tenuti a specificare gradleper i client Android

bull [class name] egrave il nome completo della classe

213 Google Cloud Datastore

Google Cloud Datastore3 (GCD) fornisce lrsquoarchiviazione dei dati senza richiedereuno schema fisso (NoSQL) garantendo una memorizzazione robusta e scalabile perle applicazioniA differenza dei tradizionali database relazionali GCD utilizza unrsquoarchitetturadistribuita per gestire automaticamente la scalabilitagrave fino a grandi insiemi di datiPoicheacute tutte le query sono servite da indici predefiniti i tipi di query che possonoessere eseguite sono piugrave restrittive rispetto a quelle consentite su un databaserelazionale con SQL In particolare non sono supportate le seguenti operazioni

3httpscloudgooglecomdatastoredocsconceptsoverview

21 Tecnologie in uso 5

join disuguaglianza di filtraggio su piugrave proprietagrave filtraggio dei dati sulla base deirisultati di una subqueryGCD salva gli oggetti di dati come entitagrave Unrsquoentitagrave ha una o piugrave proprietagrave icui valori possono essere uno dei diversi tipi di dati supportati per esempio unaproprietagrave puograve essere una stringa un numero intero o un riferimento ad unrsquoaltraentitagrave Ogni entitagrave egrave identificato dal suo genere che categorizza lrsquoentitagrave al fine dipoter effettuare query e una chiave che la identifica in modo univoco allrsquointerno delsuo genere

In Art Everywhere abbiamo utilizzato Python NDB Datastore API per po-ter definire modelli allrsquointerno di unrsquoapplicazione App Engine Un modello egrave unaclasse Python che agisce come una sorta di schema di database descrive un tipo didati in termini di proprietagrave

Nel capitolo 3 verragrave approfondita lrsquoanalisi concettuale del progetto che porteragrave alladefinizione del modello della base di dati utilizzata

214 Picasa Web Albums Data API

Le API di Picasa Web Albums consentono a siti web e applicazioni mobili di integrarsicon Picasa un software grafico per organizzare e modificare fotografie digitali evideo e di condividerle con altri utenti nei ldquoweb albumrdquoArt Everywhere memorizza tutte le immagini caricate dagli utenti su Picasa WebAlbums Usando lrsquoaccount Google dellrsquoapplicazione tutte le immagini (inviate daldispositivo mobile) vengono memorizzate dal backend in un web album chiamatoldquoArt Everywhererdquo e accessibile a chiunque tramite URL Tali URL vengono memo-rizzate nel database come una proprietagrave (url) della entitagrave PictureEntryDa App Engine lrsquoupload delle immagini su Picasa Web Album viene effettuatousando la libreria Google Data Python

215 Android

Android4 egrave un sistema operativo per dispositivi mobili sviluppato da Google Incbasato su kernel Linux e distribuito sotto i termini della licenza Apache 20 checonsente di modificare e distribuire liberamente il codice sorgentePer lo sviluppo di Art Everywhere egrave stato utilizzato Android Studio lrsquoIDE ufficialeper lo sviluppo di applicazioni Android basato su IntelliJ Idea e si egrave scelto di renderedisponibile lrsquoapplicazione a partire dalla versione sdk 15+ ovvero compatibile apartire dalla versione Android 40 (Ice Cream Sandwich)

216 Python

Python5 egrave un linguaggio di programmazione orientato agli oggetti e utilizzabile permolti tipi di sviluppo software Ersquo stato utilizzato per la realizzazione del backenddi Art Everyhwere sottoforma di una Python web app che interagisce con il web

4httpsitwikipediaorgwikiAndroid5httpswwwpythonorg

21 Tecnologie in uso 6

server GAE usando il protocollo WSGI6 In particolare egrave stato utilizzato webapp2un framework WSGI compatibile che consente di creare rapidamente sempliciapplicazioni web per il runtime di Python 27 Infatti la Python web app vieneeseguita da GAE utilizzando il linguaggio pre-caricato Python in un ambiente sicurosandbox Si tratta di un ambiente Python puro lrsquointerprete Python puograve eseguirequalsiasi codice Python ma non puograve caricare moduli Python che contengono codiceC

Inoltre in Art Everywhere il linguaggio di programmazione Python egrave statoutilizzato per codificare lrsquoalgoritmo di pattern recognition utilizzando la libreriaOpenCV (2110) il framework web Flask (218) e caricando il codice sul servizio dihosting PythonAnywhere (219)

217 OAuth 20

OAuth 20 egrave un protocollo aperto che garantisce ai service provider lrsquoaccesso daparte di terzi ai dati degli utenti proteggendo contemporanemente le loro credenzialiErsquo utilizzato dalle API di Google (ad esempio effettuare il login usando lrsquoaccountGoogle) per lrsquoautenticazione e le autorizzazioni e tutte le applicazioni seguono unpattern quando si accede ad un API di Google usando OAuth 20

bull ottenere le credenziali dalla Google Developer Console7 cioegrave il clientID e client secret che sono noti solamente a Google e alla propria applicazione

bull ottenere un token di accesso dal Server delle Autorizzazioni di Goo-gle prima che lrsquoapplicazione possa accedere ai dati privati tramite un API diGoogle si deve ottenere un token di accesso che concede lrsquoaccesso a tale APIUn parametro variabile di nome scope controlla lrsquoinsieme di risorse e delle ope-razioni che un token di accesso permette Se lrsquoutente concede lrsquoautorizzazioneil Server delle Autorizzazioni Google invia allrsquoapplicazione un token di accessoSe lrsquoutente non concede lrsquoautorizzazione il server restituisce un errore

bull inviare token di accesso ad uno specifico API in un header HTTP diautorizzazione

bull aggiornare il token di accesso se necessario poichegrave hanno una duratalimitata

218 Flask

Flask8 egrave un framework web scritto in Python e basato sullo strumento Werkzeug(libreria di utilitagrave HTTP e WSGI per Python) e con il motore template Jinja2 Flaskviene chiamato microframework percheacute non forza uno sviluppatore ad utilizzare un

6httpsitwikipediaorgwikiWeb_Server_Gateway_Interface Il Web Server Gateway In-terface (WSGI) egrave un protocollo di trasmissione che stabilisce e descrive comunicazioni ed interazionitra server ed applicazioni web scritte nel linguaggio Python Egrave quindi lrsquointerfaccia standard del webservice per la programmazione in Python

7httpsconsoledevelopersgooglecom8httpflaskpocooorgdocs010

22 Tecnologie abbandonate 7

particolare strumento o una libreria Non ha alcun livello di astrazione del databasela validazione dei form o qualsiasi altro componente in cui librerie di terze partipre-esistenti forniscono funzioni comuniIn Art Everywhere Flask egrave stato usato per realizzare unrsquoapplicazione web contenentelrsquoalgoritmo di pattern recognition per la similaritagrave tra immagini (53) e permetterecosigrave richieste RESTful effettuate dal backend

219 PythonAnywhere

PythonAnywhere9 egrave un servizio di hosting Web basato sul linguaggio di program-mazione Python Le applicazioni web ospitate possono essere scritte utilizzandoqualsiasi applicazione basata su framework WSGI con Art Everywhere abbiamoutilizzato Flask

2110 OpenCV

OpenCV10 egrave una libreria open source per software di computer vision e machinelearning OpenCV egrave stato realizzato per fornire una infrastruttura comune perapplicazioni di computer vision La libreria dispone metodi che possono essereutilizzati per rilevare e riconoscere i volti umani identificare oggetti classificare leazioni umane nei video tracciare movimenti di macchine su pista estrarre modelli3D di oggetti seguire i movimenti degli occhi riconoscere scenari eccDispone di interfacce C++ C Python Java e MATLAB e supporta WindowsLinux Android e Mac OS

In Art Everywhere tale libreria egrave stata utilizzata per realizzare lrsquoalgoritmodi pattern recognition per la similaritagrave tra immagini (53) utilizzando lrsquointerfacciaPython in ambiente Linux

22 Tecnologie abbandonate

221 Google BlobStore API

BlobStore API11 consente alle applicazioni di servire oggetti di dati chiamati blobche sono molto piugrave grandi della dimensione consentita per oggetti nel servizioDatastore come ad esempio i file video o immagini Blobs sono creati caricandoun file tramite una richiesta HTTP e cosigrave Blobstore crea un blob dal contenuto delfile e restituisce un riferimento per il blob chiamato blob key che potragrave poi essereutilizzato per servire il blobQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Per poter scrivere un blob direttamente sul Datastore egrave necessario lrsquoutilizzodi una low-level API messa a disposizione da Google Files API Essa perograve

9httpswwwpythonanywherecom10httpopencvorg11httpscloudgooglecomappenginedocsjavablobstore

23 Metodologia utilizzata ed organizzazione del lavoro 8

egrave stata deprecata da Google12 in favore dellrsquoutilizzo del solo Google CloudStorage il quale offre un servizio di scrittura file-like similare

bull Google Cloud Datastore offre uno spazio di archiviazione limitato per lrsquoarchi-viazione dei blobs (5GB di spazio free) che si sarebbe saturato facilmente seavessimo scelto di caricare le immagini direttamente su di esso

222 Google Cloud Storage

Google Cloud Storage13 egrave un servizio Internet per memorizzare i dati nel cloud diGoogleQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Spazio di archiviazione free inferiore rispetto a quello offerto da Picasa (5GBdi spazio offerti da GCS contro i 15GB di spazio gratuito offerti da GoogleDrive e di conseguenza messi a disposizione per Picasa)

bull Maggiore efficienza nellrsquoupload riscontrata nei test effettuati

23 Metodologia utilizzata ed organizzazione del lavoro

231 Milestones

Il workshop Google Technologies for Cloud and Web Development nel quale egrave statorealizzato il progetto Art Everywhere ha previsto delle milestones intermedieovvero dei momenti di verifica del progetto nei quali egrave stato presentato lo stato diavanzamento del lavoro ed egrave stato valutato dallo staff e dai mentors del workshop

Per la prima milestone (Gennaio 2015) ci siamo concentrati sullo studiodelle tecnologie utilizzate per sviluppare un Minimum Viable Product con lo scopodi presentare e testare le principali caratteristiche dellrsquoapplicazione In particolareabbiamo sviluppato lrsquoUpload delle immagini e la Galleria principale usata permostrare le opere caricate dagli artisti

Per la seconda milestone (Febbraio 2015) ci siamo focalizzati sui feedbackricevuti nella precedente e sui bisogni dei nostri utenti (gli artisti) sottoponendo unsondaggio a piugrave di 50 artisti Sono state aggiunte altre caratteristiche come la Paginadellrsquoartista il Dettaglio opera e i Filtri di ricerca opere La Release Candidate egravestata testata da 10 utenti I risultati dei sondaggi sono stati presentati nel Capitolo 6

Lo scopo della terza milestone (Marzo 2015) era quello di presentare lrsquointe-ro progetto funzionante Lrsquoapplicazione egrave stata completata realizzando la partesocial (Likes Commenti e Condivisione) migliorando lrsquoUser Interface adottando ilMaterial Design e lrsquousabilitagrave dellrsquoapplicazione attraverso dei sondaggi condotti suun campione di utenti

12httpscloudgooglecomappenginedocspythongooglestorage13httpscloudgooglecomstoragedocsoverview

23 Metodologia utilizzata ed organizzazione del lavoro 9

La quarta milestone (Aprile 2015) rappresentava la Final Submission ovve-ro la presentazione del progetto davanti ad una giuria composta oltre che dallostaff del workshop da ingegneri Google Allrsquoapplicazione sono state aggiunte lapossibilitagrave di modificareeliminare unrsquoopera drsquoarte modificareaggiornare il profilodellrsquoartista segnalare un commento o unrsquoopera offensiva e visualizzare la lista dellepersone che hanno messo un Like ad unrsquoopera

232 Divisione del lavoro

Il progetto egrave stato realizzato come lavoro di gruppo durante il workshop GoogleTechnologies for Cloud and Web Development e la suddivisione del lavoro egrave derivatadallrsquoarchitettura three-tier usata come riferimento ovvero interfaccia utente logicafunzionale (business logic) e gestione dei dati persistenti Ciascuno ha poi svi-luppato una o piugrave funzionalitagrave che ha approfondito nella propria relazione al progetto

Il mio personale contributo che viene presentato in queste pagine ha ri-guardato gli algoritmi usati per il trasferimento (uploaddownload) efficiente delleopere drsquoarte ovvero di immagini e per la loro compressione prevenendo unaperdita significativa della qualitagrave Inoltre viene presentato il sistema realizzatoper il riconoscimento di pattern finalizzato ad individuare similaritagrave tra le operedrsquoarte presenti nel database e con opere drsquoarte famose in modo da individuare falsidrsquoautore e prevenire eventuali furti di proprietagrave intellettuale

233 Tool utilizzati

Per coordinare il lavoro abbiamo utilizzato GitHub14 un servizio web di hosting perlo sviluppo di progetti software che ci ha permesso di creare una repository15 perpoter condividere il codice del progetto e lavorare cosigrave simultaneamente Inoltreabbiamo ritenuto molto utile la funzione Issues che rappresenta un ottimo modoper tenere traccia delle attivitagrave miglioramenti e bug del progetto

Abbiamo effettuato revisioni continue circa ogni 23 giorni con lo scopo diverificare lrsquoavanzamento del lavoro in base alle milestones fissate Ciograve egrave avvenutotramite incontri fisici o tramite il servizio di messaggistica istantanea e VoIPHangout16 Google Drive17 egrave stato utilizzato per lrsquoarchiviazione e lo scambio didocumenti condivisi come ad esempio immagini documentazioni diagrammidellrsquoarchitettura e di progettazioneecc Survio18 egrave un software online per crearegratuitamente questionari e sondaggi ed egrave cosigrave stato utilizzato per sottoporre iquestionari presentati nel Capitolo 6 Infine abbiamo utilizzato Android Studio19lrsquoIDE ufficiale per lo sviluppo di applicazioni Android e PyCharm20un ambiente disviluppo per la programmazione Python

14httpsgithubcom15httpsgithubcomdavideaurucciArtEverywhere16httpwwwgooglecom+learnmorehangouts17httpdrivegooglecom18httpwwwsurviocomit19httpsdeveloperandroidcomsdkindexhtml20httpswwwjetbrainscompycharm

10

Capitolo 3

Analisi concettuale del sistema

In questo capitolo viene approfondita la conoscenza del dominio di interesse inmaniera tale da poter descrivere in modo preciso e completo cosa tale progettodeve realizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

31 Modello Entitagrave-Relazioni

LikeEntry

PictureEntryArtistEntry

FlagEntry

TechniqueEntry

CommentEntry

BlacklistEntry

CommentFlag PictureFlag FlaggedPicture

FlaggedComment

PictureParent

CommentBy CommentParent

PictureTechnique

Figura 31 Schema ER dellrsquoapplicazione

311 Vincoli non esprimibili nello schema

Non sono esprimibili nello schema i seguenti vincoli esterni

bull Vincolo sul numero segnalazioni di Visitor forall v isin Istanze(IVisitor)esiste al piugrave un fd isin Istanze(IFlagged) con fd = ltUserv FlagEntryfgt

bull Vincolo sullrsquoattributo likes forall p isin Istanze(IPictureEntry) sia I = ltPictu-reEntryp ArtistEntry agt isin Istanze(ILikeEntry) | a isin Istanze(IArtistEntry)

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

Ai miei genitoriche mi hanno insegnato la strada

Ai miei fratelliche mi spingono ad andare oltre

iv

Indice

Introduzione vi

1 Requisiti 111 Specifica dei requisiti 112 Screenshots delle principali funzionalitagrave 2

2 Tecnologie e metodologie usate 321 Tecnologie in uso 3

211 Google App Engine 3212 Google Cloud Endpoints 3213 Google Cloud Datastore 4214 Picasa Web Albums Data API 5215 Android 5216 Python 5217 OAuth 20 6218 Flask 6219 PythonAnywhere 72110 OpenCV 7

22 Tecnologie abbandonate 7221 Google BlobStore API 7222 Google Cloud Storage 8

23 Metodologia utilizzata ed organizzazione del lavoro 8231 Milestones 8232 Divisione del lavoro 9233 Tool utilizzati 9

3 Analisi concettuale del sistema 1031 Modello Entitagrave-Relazioni 10

311 Vincoli non esprimibili nello schema 10312 Glossario delle entitagrave e delle relazioni 11313 Ristrutturazione dello schema ER 12

32 Use Case Diagram 15321 Carica opera drsquoarte 15322 Ricerca opera drsquoarte 16323 Visualizza galleria delle opere 16

Indice v

4 Progettazione del sistema 1741 Architettura del sistema 1742 Progettazione logica del data layer 18

421 Schema logico dei dati 18422 Ristrutturazione dello schema logico 19

5 Realizzazione del sistema 2351 Upload immagini 23

511 Sequence diagram 23512 Implementazione 24513 Aspetti particolari 27

52 Algoritmo di compressione immagini Whatsapp-like 27521 Stato dellrsquoarte 27522 Metodo proposto e implementazione 28523 Risultati ottenuti 31

53 Pattern recognition per similaritagrave tra opere drsquoarte 32531 Stato dellrsquoarte 32532 Metodo proposto e implementazione 33533 Risultati ottenuti 39

54 Download immagini 41541 Sequence diagram 41542 Implementazione 41543 Aspetti particolari 45

6 Distribuzione e Validazione 4661 Installazione applicazione 4662 Validazione 47

621 User-Centered Design 47622 Risultati sondaggi 48

A Appendice Immagini 55A1 Immagini per test di compressione 55A2 Opere drsquoarte 56A3 Immagini di ricerca 57

Ringraziamenti 58

vi

Introduzione

Il presente progetto di tesi egrave il frutto di un lavoro di gruppo svolto durante ilworkshop Google Technologies for Cloud and Web Development1 che ha portatoalla luce Art Everywhere un social network in cui gli artisti emergenti possonofarsi conoscere e condividere le proprie opere drsquoarteSi tratta di unrsquoapplicazione Android nata per soddisfare il bisogno di migliaiadi artisti emergenti di promuovere la propria arte in uno spazio completamentededicato a loro in cui egrave possibile venire a contatto con altri artisti critici eappassionati drsquoarte Questi possono giudicare tramite un like commentare econdividere le opere drsquoarte degli artisti registrati sulla piattaforma

Il workshop durato 5 mesi (Dicembre 2014 - Aprile 2015) egrave stato organiz-zato dallrsquoUniversitagrave La Sapienza in collaborazione con Google Tel Aviv e ha visto lapartecipazione di studenti delle tre universitagrave di Roma (La Sapienza Tor Vergata eRoma Tre) Gli studenti partecipanti sono stati divisi in gruppi ciascuno dei qualiha dovuto realizzare un progetto ovvero la progettazione e lo sviluppo di un sistemaweb live Si egrave trattato di un workshop incentrato sul cloud e sul web developmentutilizzando principalmente ma non esclusivamente strumenti e tecnologie diGoogle Il workshop ha previsto revisioni periodiche del progetto nelle quali egrave statopresentato lo stato di avanzamento del lavoro ed egrave stato valutato dallo staff e daimentors del workshop Al termine di esso il progetto ha ricevuto una valutazionefinale di 99100 Inoltre Art Everywhere ha ricevuto una menzione speciale duranteil keynote Entrepreneurship at scale di Yossi Matias (Vice Presidente di Google eAmministratore Delegato del centro RampD Google Israele) durante la conferenzainternazionale WWW2015 Entrepreneurs Track2 tenutasi a Firenze nel mese diMaggio 2015

Il gruppo che ha lavorato ad Art Everywhere egrave composto da 5 componentie ciascuno ha sviluppato una o piugrave funzionalitagrave che ha approfondito nella propriarelazione al progetto

Lrsquoobiettivo del mio progetto di tesi egrave quello di mostrare gli algoritmi usatiper il trasferimento (uploaddownload) efficiente delle opere drsquoarte cioegrave di immaginie per la loro compressione prevenendo una perdita significativa della qualitagrave eottenendo cosigrave un comportamento simile allrsquoalgoritmo di compressione immagini

1httpssitesgooglecomadisuniroma1itgoogle-technologies-for-cloud-and-web-development2httpwwwet2015org

vii

usato da WhatsappInoltre viene presentato il sistema realizzato per il riconoscimento di patternfinalizzato ad individuare similaritagrave tra le opere drsquoarte presenti nel database e conopere drsquoarte famose in modo da individuare falsi drsquoautore e prevenire eventualifurti di proprietagrave intellettuale

Struttura della tesiPer concludere la parte introduttiva diamo per ogni capitolo una breve sintesi

Capitolo 1 Viene presentata una descrizione completa e dettagliata della realtagrave diinteresse che mette in evidenza quali sono i dati che il sistema deve gestiree quali sono le principali funzionalitagrave includendo per alcune di esse unoscreenshot

Capitolo 2 Vengono mostrate le tecnologie adottate nel progetto soffermandosiin particolare su quelle innovative (ovvero non presentate nei corsi universi-tari) e su quelle in uso e specificando le motivazioni che ci hanno spinto adabbandonarne alcune Inoltre viene presentata la metodologia utilizzata nellaconduzione del progetto

Capitolo 3 Viene approfondita la conoscenza del dominio di interesse in manieratale da poter descrivere in modo preciso e completo cosa questo progetto deverealizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

Capitolo 4 Si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedelepossibile allo schema ER di partenza e che sia al tempo stesso efficiente

Capitolo 5 Viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inoltre ci si sofferma maggiormentesullo sviluppo degli algoritmi usati per il trasferimento efficiente e per lacompressione di immagini prevenendo una significativa perdita di qualitagraveInfine viene presentato il sistema realizzato per il riconoscimento di patterntra opere drsquoarte finalizzato ad individuare similaritagrave tra opere drsquoarte

Capitolo 6 Vengono date indicazioni su come installare lrsquoapplicazione e si descrivecome egrave stata effettuata la validazione e la fase di test dellrsquoapplicazione

1

Capitolo 1

Requisiti

In questo capitolo viene effettuata la raccolta e lrsquoanalisi dei requisti procedendoquindi alla definizione delle proprietagrave e delle funzionalitagrave del sistema Viene prodottauna descrizione completa e dettagliata dei dati che il sistema deve gestire e delleoperazioni da effettuare su di essi Infine vengono illustrati alcuni screenshots delleprincipali funzionalitagrave del sistema

11 Specifica dei requisitiSi vuole progettare lo schema concettuale corrispondente allrsquoapplicazione nella qualeinteressa memorizzare lrsquoemail di ogni utente Ogni utente puograve essere un visitatore(ed in tal caso non interessa memorizzare alcuna proprietagrave aggiuntiva) o un artistaper il quale si vuole memorizzare il nome il cognome unrsquoimmagine di profilo edeventualmente un nickname il suo sito la sua biografia e lrsquoeventuale id dellrsquoimmaginedi profilo (in caso essa venga sostituita) Egrave di interesse per lrsquoapplicazione memorizzareinformazioni sulle opere drsquoarte caricate dagli artisti Nello specifico interessano lrsquourldella immagine il suo identificativo di caricamento la data e ora di caricamentoil titolo ed eventualmente una descrizione il luogo in cui egrave stata realizzata e lesue dimensioni Si vuole anche memorizzare lrsquoemail dellrsquoartista che ha caricatolrsquoopera Si vogliono anche memorizzare le tecniche pittoriche delle quali interessamemorizzare il nome (univoco) e che sono identificate per mezzo di una chiavenumerica Ogni opera drsquoarte caricata deve necessariamente specificare il tipo ditecnica pittorica utilizzata Le opere drsquoarte possono ricevere apprezzamenti e critichesotto forma di likes e commenti Di ogni like memorizzato interessa sapere chi egravelrsquoartista che lo ha apposto lrsquoopera drsquoarte coinvolta e la data e ora in cui esso egravestato apposto Per ogni opera drsquoarte egrave di interesse memorizzare anche il numerodi like Ogni commento egrave identificato da un codice numerico e di esso interessa iltesto del commento la data e ora in cui esso egrave stato apposto lrsquoutente che lo haapposto e lrsquoopera drsquoarte coinvolta Opere drsquoarte e commenti possono essere giudicatidagli artisti registrati come inappropriati A tale scopo egrave possibile segnalare uncommento o unrsquoopera drsquoarte e della segnalazione interessa sapere qual egrave il contenutocoinvolto lrsquoartista segnalante e lrsquoutente segnalato Ogni artista puograve segnalare uncerto contenuto unrsquounica volta Inoltre si vuole tenere traccia degli utenti che acausa delle segnalazioni ricevute sono finiti sulla ldquolista nerardquo dellrsquoapplicazione e

12 Screenshots delle principali funzionalitagrave 2

che non possono piugrave utilizzarla Di una entry della lista nera interessa sapere chi egravelrsquoutente coinvolto In particolare un utente visitatore finisce in lista nera alla primasegnalazione ricevuta mentre un utente artista finisce in lista nera solo dopo cheavendo valutato le segnalazioni ricevute si ritiene che esso debba essere inserito inessa A tale scopo per lrsquoartista si memorizza una proprietagrave aggiuntiva che tieneconto della gravitagrave dello storico delle segnalazioni precedenti

12 Screenshots delle principali funzionalitagrave

Figura 11 Galleria principale Figura 12 Profilo Artista

Figura 13 Dettaglio Opera Figura 14 Commenti

3

Capitolo 2

Tecnologie e metodologie usate

In questo capitolo verranno presentate le principali tecnologie utilizzate specificandole funzionalitagrave delle tecnologie attualmente in uso e le motivazioni che ci hannospinto ad abbandonare alcune tecnologie In seguito verragrave presentata la metodologiautilizzata nella conduzione del progetto durante il periodo del workshop Google e larelativa organizzazione del lavoro tra i componenti del gruppo

21 Tecnologie in uso

211 Google App Engine

Google App Engine1 (GAE) egrave una Platform as a Service (PaaS) che consente dicreare ed eseguire applicazioni web sullrsquoinfrastruttura di Google GAE offre unascalabilitagrave automatica per le applicazioni a seconda del numero di richieste drsquousoper quella applicazione ed alloca in automatico piugrave risorse per gestire la doman-da addizionale Le applicazioni vengono eseguite in un ambiente sandbox sicuropermettendo la distribuzione delle richieste su piugrave server e la scalabilitagrave dei serverper soddisfare le richieste di traffico GAE supporta app scritte in una varietagrave dilinguaggi di programmazione come Java Python PHP e GoPer lo sviluppo di Art Everywhere si egrave scelto utilizzare il linguaggio di programma-zione Python e quindi di realizzare una Python web app che rappresenta il backenddellrsquoapplicazione

212 Google Cloud Endpoints

Google Cloud Endpoints2 (GCE) egrave un insieme di strumenti librerie e funzionalitagraveche consentono di generare API e librerie client da unrsquoapplicazione GAE (backend)per semplificare lrsquoaccesso client ai dati da altre applicazioni GCE utilizza la libreriaGoogle Protocol RPC un protocollo per lrsquoinvocazione remota di procedure HTTP-based Egrave possibile definire un servizio RPC in una singola classe Python che contieneun certo numero di metodi remoti dichiarati Ogni metodo remoto accetta un insiemespecifico di parametri come richiesta e restituisce una risposta specifica Questiparametri di richiesta e di risposta sono le classi definite dallrsquoutente note come

1httpscloudgooglecomappengine2httpscloudgooglecomappenginedocsjavaendpoints

21 Tecnologie in uso 4

Tabella 21 Parametri accettati da un metodo remoto

Request Message Class La classe del messaggio di richiesta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Response Message Class La classe del messaggio di risposta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Name Nome alternativo al metodoPath Il percorso URI da usare per accedere al

metodoHttp method Il metodo HTTP da usare (GET POST

ecc)

messaggi (ProtoRPC Messages) La Tabella 21 mostra i parametri accettati daimetodi remotiDopo aver completato la creazione dei vari metodi egrave possibile auto-generare lelibrerie per il client e quindi da importare nellrsquoapplicazione mobile Nel caso diArt Everywhere le librerie sono scritte in Java dato che si egrave scelto di realizzareunrsquoapplicazione Android Per autogenerare le librerie per il client egrave necessario usareil seguente comando da linea di comando

google_appengineendpointscfgpy ltcommandgt lttarget_langgt ltoptionsgt[class-name]

bull ltcommandgt puograve essere get_client_lib o get_discovery_doc

bull lttarget_langgt (usato solo con get_client_lib) specifica il tipo di pacchettoche si desidera creare Si egrave tenuti ad inserire il valore java per i client Javacome Android

bull ltoptiongt se fornito indica una o piugrave opzioni disponibili Ad esempio build-system specifica il tipo di bundle da produrre Si egrave tenuti a specificare gradleper i client Android

bull [class name] egrave il nome completo della classe

213 Google Cloud Datastore

Google Cloud Datastore3 (GCD) fornisce lrsquoarchiviazione dei dati senza richiedereuno schema fisso (NoSQL) garantendo una memorizzazione robusta e scalabile perle applicazioniA differenza dei tradizionali database relazionali GCD utilizza unrsquoarchitetturadistribuita per gestire automaticamente la scalabilitagrave fino a grandi insiemi di datiPoicheacute tutte le query sono servite da indici predefiniti i tipi di query che possonoessere eseguite sono piugrave restrittive rispetto a quelle consentite su un databaserelazionale con SQL In particolare non sono supportate le seguenti operazioni

3httpscloudgooglecomdatastoredocsconceptsoverview

21 Tecnologie in uso 5

join disuguaglianza di filtraggio su piugrave proprietagrave filtraggio dei dati sulla base deirisultati di una subqueryGCD salva gli oggetti di dati come entitagrave Unrsquoentitagrave ha una o piugrave proprietagrave icui valori possono essere uno dei diversi tipi di dati supportati per esempio unaproprietagrave puograve essere una stringa un numero intero o un riferimento ad unrsquoaltraentitagrave Ogni entitagrave egrave identificato dal suo genere che categorizza lrsquoentitagrave al fine dipoter effettuare query e una chiave che la identifica in modo univoco allrsquointerno delsuo genere

In Art Everywhere abbiamo utilizzato Python NDB Datastore API per po-ter definire modelli allrsquointerno di unrsquoapplicazione App Engine Un modello egrave unaclasse Python che agisce come una sorta di schema di database descrive un tipo didati in termini di proprietagrave

Nel capitolo 3 verragrave approfondita lrsquoanalisi concettuale del progetto che porteragrave alladefinizione del modello della base di dati utilizzata

214 Picasa Web Albums Data API

Le API di Picasa Web Albums consentono a siti web e applicazioni mobili di integrarsicon Picasa un software grafico per organizzare e modificare fotografie digitali evideo e di condividerle con altri utenti nei ldquoweb albumrdquoArt Everywhere memorizza tutte le immagini caricate dagli utenti su Picasa WebAlbums Usando lrsquoaccount Google dellrsquoapplicazione tutte le immagini (inviate daldispositivo mobile) vengono memorizzate dal backend in un web album chiamatoldquoArt Everywhererdquo e accessibile a chiunque tramite URL Tali URL vengono memo-rizzate nel database come una proprietagrave (url) della entitagrave PictureEntryDa App Engine lrsquoupload delle immagini su Picasa Web Album viene effettuatousando la libreria Google Data Python

215 Android

Android4 egrave un sistema operativo per dispositivi mobili sviluppato da Google Incbasato su kernel Linux e distribuito sotto i termini della licenza Apache 20 checonsente di modificare e distribuire liberamente il codice sorgentePer lo sviluppo di Art Everywhere egrave stato utilizzato Android Studio lrsquoIDE ufficialeper lo sviluppo di applicazioni Android basato su IntelliJ Idea e si egrave scelto di renderedisponibile lrsquoapplicazione a partire dalla versione sdk 15+ ovvero compatibile apartire dalla versione Android 40 (Ice Cream Sandwich)

216 Python

Python5 egrave un linguaggio di programmazione orientato agli oggetti e utilizzabile permolti tipi di sviluppo software Ersquo stato utilizzato per la realizzazione del backenddi Art Everyhwere sottoforma di una Python web app che interagisce con il web

4httpsitwikipediaorgwikiAndroid5httpswwwpythonorg

21 Tecnologie in uso 6

server GAE usando il protocollo WSGI6 In particolare egrave stato utilizzato webapp2un framework WSGI compatibile che consente di creare rapidamente sempliciapplicazioni web per il runtime di Python 27 Infatti la Python web app vieneeseguita da GAE utilizzando il linguaggio pre-caricato Python in un ambiente sicurosandbox Si tratta di un ambiente Python puro lrsquointerprete Python puograve eseguirequalsiasi codice Python ma non puograve caricare moduli Python che contengono codiceC

Inoltre in Art Everywhere il linguaggio di programmazione Python egrave statoutilizzato per codificare lrsquoalgoritmo di pattern recognition utilizzando la libreriaOpenCV (2110) il framework web Flask (218) e caricando il codice sul servizio dihosting PythonAnywhere (219)

217 OAuth 20

OAuth 20 egrave un protocollo aperto che garantisce ai service provider lrsquoaccesso daparte di terzi ai dati degli utenti proteggendo contemporanemente le loro credenzialiErsquo utilizzato dalle API di Google (ad esempio effettuare il login usando lrsquoaccountGoogle) per lrsquoautenticazione e le autorizzazioni e tutte le applicazioni seguono unpattern quando si accede ad un API di Google usando OAuth 20

bull ottenere le credenziali dalla Google Developer Console7 cioegrave il clientID e client secret che sono noti solamente a Google e alla propria applicazione

bull ottenere un token di accesso dal Server delle Autorizzazioni di Goo-gle prima che lrsquoapplicazione possa accedere ai dati privati tramite un API diGoogle si deve ottenere un token di accesso che concede lrsquoaccesso a tale APIUn parametro variabile di nome scope controlla lrsquoinsieme di risorse e delle ope-razioni che un token di accesso permette Se lrsquoutente concede lrsquoautorizzazioneil Server delle Autorizzazioni Google invia allrsquoapplicazione un token di accessoSe lrsquoutente non concede lrsquoautorizzazione il server restituisce un errore

bull inviare token di accesso ad uno specifico API in un header HTTP diautorizzazione

bull aggiornare il token di accesso se necessario poichegrave hanno una duratalimitata

218 Flask

Flask8 egrave un framework web scritto in Python e basato sullo strumento Werkzeug(libreria di utilitagrave HTTP e WSGI per Python) e con il motore template Jinja2 Flaskviene chiamato microframework percheacute non forza uno sviluppatore ad utilizzare un

6httpsitwikipediaorgwikiWeb_Server_Gateway_Interface Il Web Server Gateway In-terface (WSGI) egrave un protocollo di trasmissione che stabilisce e descrive comunicazioni ed interazionitra server ed applicazioni web scritte nel linguaggio Python Egrave quindi lrsquointerfaccia standard del webservice per la programmazione in Python

7httpsconsoledevelopersgooglecom8httpflaskpocooorgdocs010

22 Tecnologie abbandonate 7

particolare strumento o una libreria Non ha alcun livello di astrazione del databasela validazione dei form o qualsiasi altro componente in cui librerie di terze partipre-esistenti forniscono funzioni comuniIn Art Everywhere Flask egrave stato usato per realizzare unrsquoapplicazione web contenentelrsquoalgoritmo di pattern recognition per la similaritagrave tra immagini (53) e permetterecosigrave richieste RESTful effettuate dal backend

219 PythonAnywhere

PythonAnywhere9 egrave un servizio di hosting Web basato sul linguaggio di program-mazione Python Le applicazioni web ospitate possono essere scritte utilizzandoqualsiasi applicazione basata su framework WSGI con Art Everywhere abbiamoutilizzato Flask

2110 OpenCV

OpenCV10 egrave una libreria open source per software di computer vision e machinelearning OpenCV egrave stato realizzato per fornire una infrastruttura comune perapplicazioni di computer vision La libreria dispone metodi che possono essereutilizzati per rilevare e riconoscere i volti umani identificare oggetti classificare leazioni umane nei video tracciare movimenti di macchine su pista estrarre modelli3D di oggetti seguire i movimenti degli occhi riconoscere scenari eccDispone di interfacce C++ C Python Java e MATLAB e supporta WindowsLinux Android e Mac OS

In Art Everywhere tale libreria egrave stata utilizzata per realizzare lrsquoalgoritmodi pattern recognition per la similaritagrave tra immagini (53) utilizzando lrsquointerfacciaPython in ambiente Linux

22 Tecnologie abbandonate

221 Google BlobStore API

BlobStore API11 consente alle applicazioni di servire oggetti di dati chiamati blobche sono molto piugrave grandi della dimensione consentita per oggetti nel servizioDatastore come ad esempio i file video o immagini Blobs sono creati caricandoun file tramite una richiesta HTTP e cosigrave Blobstore crea un blob dal contenuto delfile e restituisce un riferimento per il blob chiamato blob key che potragrave poi essereutilizzato per servire il blobQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Per poter scrivere un blob direttamente sul Datastore egrave necessario lrsquoutilizzodi una low-level API messa a disposizione da Google Files API Essa perograve

9httpswwwpythonanywherecom10httpopencvorg11httpscloudgooglecomappenginedocsjavablobstore

23 Metodologia utilizzata ed organizzazione del lavoro 8

egrave stata deprecata da Google12 in favore dellrsquoutilizzo del solo Google CloudStorage il quale offre un servizio di scrittura file-like similare

bull Google Cloud Datastore offre uno spazio di archiviazione limitato per lrsquoarchi-viazione dei blobs (5GB di spazio free) che si sarebbe saturato facilmente seavessimo scelto di caricare le immagini direttamente su di esso

222 Google Cloud Storage

Google Cloud Storage13 egrave un servizio Internet per memorizzare i dati nel cloud diGoogleQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Spazio di archiviazione free inferiore rispetto a quello offerto da Picasa (5GBdi spazio offerti da GCS contro i 15GB di spazio gratuito offerti da GoogleDrive e di conseguenza messi a disposizione per Picasa)

bull Maggiore efficienza nellrsquoupload riscontrata nei test effettuati

23 Metodologia utilizzata ed organizzazione del lavoro

231 Milestones

Il workshop Google Technologies for Cloud and Web Development nel quale egrave statorealizzato il progetto Art Everywhere ha previsto delle milestones intermedieovvero dei momenti di verifica del progetto nei quali egrave stato presentato lo stato diavanzamento del lavoro ed egrave stato valutato dallo staff e dai mentors del workshop

Per la prima milestone (Gennaio 2015) ci siamo concentrati sullo studiodelle tecnologie utilizzate per sviluppare un Minimum Viable Product con lo scopodi presentare e testare le principali caratteristiche dellrsquoapplicazione In particolareabbiamo sviluppato lrsquoUpload delle immagini e la Galleria principale usata permostrare le opere caricate dagli artisti

Per la seconda milestone (Febbraio 2015) ci siamo focalizzati sui feedbackricevuti nella precedente e sui bisogni dei nostri utenti (gli artisti) sottoponendo unsondaggio a piugrave di 50 artisti Sono state aggiunte altre caratteristiche come la Paginadellrsquoartista il Dettaglio opera e i Filtri di ricerca opere La Release Candidate egravestata testata da 10 utenti I risultati dei sondaggi sono stati presentati nel Capitolo 6

Lo scopo della terza milestone (Marzo 2015) era quello di presentare lrsquointe-ro progetto funzionante Lrsquoapplicazione egrave stata completata realizzando la partesocial (Likes Commenti e Condivisione) migliorando lrsquoUser Interface adottando ilMaterial Design e lrsquousabilitagrave dellrsquoapplicazione attraverso dei sondaggi condotti suun campione di utenti

12httpscloudgooglecomappenginedocspythongooglestorage13httpscloudgooglecomstoragedocsoverview

23 Metodologia utilizzata ed organizzazione del lavoro 9

La quarta milestone (Aprile 2015) rappresentava la Final Submission ovve-ro la presentazione del progetto davanti ad una giuria composta oltre che dallostaff del workshop da ingegneri Google Allrsquoapplicazione sono state aggiunte lapossibilitagrave di modificareeliminare unrsquoopera drsquoarte modificareaggiornare il profilodellrsquoartista segnalare un commento o unrsquoopera offensiva e visualizzare la lista dellepersone che hanno messo un Like ad unrsquoopera

232 Divisione del lavoro

Il progetto egrave stato realizzato come lavoro di gruppo durante il workshop GoogleTechnologies for Cloud and Web Development e la suddivisione del lavoro egrave derivatadallrsquoarchitettura three-tier usata come riferimento ovvero interfaccia utente logicafunzionale (business logic) e gestione dei dati persistenti Ciascuno ha poi svi-luppato una o piugrave funzionalitagrave che ha approfondito nella propria relazione al progetto

Il mio personale contributo che viene presentato in queste pagine ha ri-guardato gli algoritmi usati per il trasferimento (uploaddownload) efficiente delleopere drsquoarte ovvero di immagini e per la loro compressione prevenendo unaperdita significativa della qualitagrave Inoltre viene presentato il sistema realizzatoper il riconoscimento di pattern finalizzato ad individuare similaritagrave tra le operedrsquoarte presenti nel database e con opere drsquoarte famose in modo da individuare falsidrsquoautore e prevenire eventuali furti di proprietagrave intellettuale

233 Tool utilizzati

Per coordinare il lavoro abbiamo utilizzato GitHub14 un servizio web di hosting perlo sviluppo di progetti software che ci ha permesso di creare una repository15 perpoter condividere il codice del progetto e lavorare cosigrave simultaneamente Inoltreabbiamo ritenuto molto utile la funzione Issues che rappresenta un ottimo modoper tenere traccia delle attivitagrave miglioramenti e bug del progetto

Abbiamo effettuato revisioni continue circa ogni 23 giorni con lo scopo diverificare lrsquoavanzamento del lavoro in base alle milestones fissate Ciograve egrave avvenutotramite incontri fisici o tramite il servizio di messaggistica istantanea e VoIPHangout16 Google Drive17 egrave stato utilizzato per lrsquoarchiviazione e lo scambio didocumenti condivisi come ad esempio immagini documentazioni diagrammidellrsquoarchitettura e di progettazioneecc Survio18 egrave un software online per crearegratuitamente questionari e sondaggi ed egrave cosigrave stato utilizzato per sottoporre iquestionari presentati nel Capitolo 6 Infine abbiamo utilizzato Android Studio19lrsquoIDE ufficiale per lo sviluppo di applicazioni Android e PyCharm20un ambiente disviluppo per la programmazione Python

14httpsgithubcom15httpsgithubcomdavideaurucciArtEverywhere16httpwwwgooglecom+learnmorehangouts17httpdrivegooglecom18httpwwwsurviocomit19httpsdeveloperandroidcomsdkindexhtml20httpswwwjetbrainscompycharm

10

Capitolo 3

Analisi concettuale del sistema

In questo capitolo viene approfondita la conoscenza del dominio di interesse inmaniera tale da poter descrivere in modo preciso e completo cosa tale progettodeve realizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

31 Modello Entitagrave-Relazioni

LikeEntry

PictureEntryArtistEntry

FlagEntry

TechniqueEntry

CommentEntry

BlacklistEntry

CommentFlag PictureFlag FlaggedPicture

FlaggedComment

PictureParent

CommentBy CommentParent

PictureTechnique

Figura 31 Schema ER dellrsquoapplicazione

311 Vincoli non esprimibili nello schema

Non sono esprimibili nello schema i seguenti vincoli esterni

bull Vincolo sul numero segnalazioni di Visitor forall v isin Istanze(IVisitor)esiste al piugrave un fd isin Istanze(IFlagged) con fd = ltUserv FlagEntryfgt

bull Vincolo sullrsquoattributo likes forall p isin Istanze(IPictureEntry) sia I = ltPictu-reEntryp ArtistEntry agt isin Istanze(ILikeEntry) | a isin Istanze(IArtistEntry)

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

iv

Indice

Introduzione vi

1 Requisiti 111 Specifica dei requisiti 112 Screenshots delle principali funzionalitagrave 2

2 Tecnologie e metodologie usate 321 Tecnologie in uso 3

211 Google App Engine 3212 Google Cloud Endpoints 3213 Google Cloud Datastore 4214 Picasa Web Albums Data API 5215 Android 5216 Python 5217 OAuth 20 6218 Flask 6219 PythonAnywhere 72110 OpenCV 7

22 Tecnologie abbandonate 7221 Google BlobStore API 7222 Google Cloud Storage 8

23 Metodologia utilizzata ed organizzazione del lavoro 8231 Milestones 8232 Divisione del lavoro 9233 Tool utilizzati 9

3 Analisi concettuale del sistema 1031 Modello Entitagrave-Relazioni 10

311 Vincoli non esprimibili nello schema 10312 Glossario delle entitagrave e delle relazioni 11313 Ristrutturazione dello schema ER 12

32 Use Case Diagram 15321 Carica opera drsquoarte 15322 Ricerca opera drsquoarte 16323 Visualizza galleria delle opere 16

Indice v

4 Progettazione del sistema 1741 Architettura del sistema 1742 Progettazione logica del data layer 18

421 Schema logico dei dati 18422 Ristrutturazione dello schema logico 19

5 Realizzazione del sistema 2351 Upload immagini 23

511 Sequence diagram 23512 Implementazione 24513 Aspetti particolari 27

52 Algoritmo di compressione immagini Whatsapp-like 27521 Stato dellrsquoarte 27522 Metodo proposto e implementazione 28523 Risultati ottenuti 31

53 Pattern recognition per similaritagrave tra opere drsquoarte 32531 Stato dellrsquoarte 32532 Metodo proposto e implementazione 33533 Risultati ottenuti 39

54 Download immagini 41541 Sequence diagram 41542 Implementazione 41543 Aspetti particolari 45

6 Distribuzione e Validazione 4661 Installazione applicazione 4662 Validazione 47

621 User-Centered Design 47622 Risultati sondaggi 48

A Appendice Immagini 55A1 Immagini per test di compressione 55A2 Opere drsquoarte 56A3 Immagini di ricerca 57

Ringraziamenti 58

vi

Introduzione

Il presente progetto di tesi egrave il frutto di un lavoro di gruppo svolto durante ilworkshop Google Technologies for Cloud and Web Development1 che ha portatoalla luce Art Everywhere un social network in cui gli artisti emergenti possonofarsi conoscere e condividere le proprie opere drsquoarteSi tratta di unrsquoapplicazione Android nata per soddisfare il bisogno di migliaiadi artisti emergenti di promuovere la propria arte in uno spazio completamentededicato a loro in cui egrave possibile venire a contatto con altri artisti critici eappassionati drsquoarte Questi possono giudicare tramite un like commentare econdividere le opere drsquoarte degli artisti registrati sulla piattaforma

Il workshop durato 5 mesi (Dicembre 2014 - Aprile 2015) egrave stato organiz-zato dallrsquoUniversitagrave La Sapienza in collaborazione con Google Tel Aviv e ha visto lapartecipazione di studenti delle tre universitagrave di Roma (La Sapienza Tor Vergata eRoma Tre) Gli studenti partecipanti sono stati divisi in gruppi ciascuno dei qualiha dovuto realizzare un progetto ovvero la progettazione e lo sviluppo di un sistemaweb live Si egrave trattato di un workshop incentrato sul cloud e sul web developmentutilizzando principalmente ma non esclusivamente strumenti e tecnologie diGoogle Il workshop ha previsto revisioni periodiche del progetto nelle quali egrave statopresentato lo stato di avanzamento del lavoro ed egrave stato valutato dallo staff e daimentors del workshop Al termine di esso il progetto ha ricevuto una valutazionefinale di 99100 Inoltre Art Everywhere ha ricevuto una menzione speciale duranteil keynote Entrepreneurship at scale di Yossi Matias (Vice Presidente di Google eAmministratore Delegato del centro RampD Google Israele) durante la conferenzainternazionale WWW2015 Entrepreneurs Track2 tenutasi a Firenze nel mese diMaggio 2015

Il gruppo che ha lavorato ad Art Everywhere egrave composto da 5 componentie ciascuno ha sviluppato una o piugrave funzionalitagrave che ha approfondito nella propriarelazione al progetto

Lrsquoobiettivo del mio progetto di tesi egrave quello di mostrare gli algoritmi usatiper il trasferimento (uploaddownload) efficiente delle opere drsquoarte cioegrave di immaginie per la loro compressione prevenendo una perdita significativa della qualitagrave eottenendo cosigrave un comportamento simile allrsquoalgoritmo di compressione immagini

1httpssitesgooglecomadisuniroma1itgoogle-technologies-for-cloud-and-web-development2httpwwwet2015org

vii

usato da WhatsappInoltre viene presentato il sistema realizzato per il riconoscimento di patternfinalizzato ad individuare similaritagrave tra le opere drsquoarte presenti nel database e conopere drsquoarte famose in modo da individuare falsi drsquoautore e prevenire eventualifurti di proprietagrave intellettuale

Struttura della tesiPer concludere la parte introduttiva diamo per ogni capitolo una breve sintesi

Capitolo 1 Viene presentata una descrizione completa e dettagliata della realtagrave diinteresse che mette in evidenza quali sono i dati che il sistema deve gestiree quali sono le principali funzionalitagrave includendo per alcune di esse unoscreenshot

Capitolo 2 Vengono mostrate le tecnologie adottate nel progetto soffermandosiin particolare su quelle innovative (ovvero non presentate nei corsi universi-tari) e su quelle in uso e specificando le motivazioni che ci hanno spinto adabbandonarne alcune Inoltre viene presentata la metodologia utilizzata nellaconduzione del progetto

Capitolo 3 Viene approfondita la conoscenza del dominio di interesse in manieratale da poter descrivere in modo preciso e completo cosa questo progetto deverealizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

Capitolo 4 Si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedelepossibile allo schema ER di partenza e che sia al tempo stesso efficiente

Capitolo 5 Viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inoltre ci si sofferma maggiormentesullo sviluppo degli algoritmi usati per il trasferimento efficiente e per lacompressione di immagini prevenendo una significativa perdita di qualitagraveInfine viene presentato il sistema realizzato per il riconoscimento di patterntra opere drsquoarte finalizzato ad individuare similaritagrave tra opere drsquoarte

Capitolo 6 Vengono date indicazioni su come installare lrsquoapplicazione e si descrivecome egrave stata effettuata la validazione e la fase di test dellrsquoapplicazione

1

Capitolo 1

Requisiti

In questo capitolo viene effettuata la raccolta e lrsquoanalisi dei requisti procedendoquindi alla definizione delle proprietagrave e delle funzionalitagrave del sistema Viene prodottauna descrizione completa e dettagliata dei dati che il sistema deve gestire e delleoperazioni da effettuare su di essi Infine vengono illustrati alcuni screenshots delleprincipali funzionalitagrave del sistema

11 Specifica dei requisitiSi vuole progettare lo schema concettuale corrispondente allrsquoapplicazione nella qualeinteressa memorizzare lrsquoemail di ogni utente Ogni utente puograve essere un visitatore(ed in tal caso non interessa memorizzare alcuna proprietagrave aggiuntiva) o un artistaper il quale si vuole memorizzare il nome il cognome unrsquoimmagine di profilo edeventualmente un nickname il suo sito la sua biografia e lrsquoeventuale id dellrsquoimmaginedi profilo (in caso essa venga sostituita) Egrave di interesse per lrsquoapplicazione memorizzareinformazioni sulle opere drsquoarte caricate dagli artisti Nello specifico interessano lrsquourldella immagine il suo identificativo di caricamento la data e ora di caricamentoil titolo ed eventualmente una descrizione il luogo in cui egrave stata realizzata e lesue dimensioni Si vuole anche memorizzare lrsquoemail dellrsquoartista che ha caricatolrsquoopera Si vogliono anche memorizzare le tecniche pittoriche delle quali interessamemorizzare il nome (univoco) e che sono identificate per mezzo di una chiavenumerica Ogni opera drsquoarte caricata deve necessariamente specificare il tipo ditecnica pittorica utilizzata Le opere drsquoarte possono ricevere apprezzamenti e critichesotto forma di likes e commenti Di ogni like memorizzato interessa sapere chi egravelrsquoartista che lo ha apposto lrsquoopera drsquoarte coinvolta e la data e ora in cui esso egravestato apposto Per ogni opera drsquoarte egrave di interesse memorizzare anche il numerodi like Ogni commento egrave identificato da un codice numerico e di esso interessa iltesto del commento la data e ora in cui esso egrave stato apposto lrsquoutente che lo haapposto e lrsquoopera drsquoarte coinvolta Opere drsquoarte e commenti possono essere giudicatidagli artisti registrati come inappropriati A tale scopo egrave possibile segnalare uncommento o unrsquoopera drsquoarte e della segnalazione interessa sapere qual egrave il contenutocoinvolto lrsquoartista segnalante e lrsquoutente segnalato Ogni artista puograve segnalare uncerto contenuto unrsquounica volta Inoltre si vuole tenere traccia degli utenti che acausa delle segnalazioni ricevute sono finiti sulla ldquolista nerardquo dellrsquoapplicazione e

12 Screenshots delle principali funzionalitagrave 2

che non possono piugrave utilizzarla Di una entry della lista nera interessa sapere chi egravelrsquoutente coinvolto In particolare un utente visitatore finisce in lista nera alla primasegnalazione ricevuta mentre un utente artista finisce in lista nera solo dopo cheavendo valutato le segnalazioni ricevute si ritiene che esso debba essere inserito inessa A tale scopo per lrsquoartista si memorizza una proprietagrave aggiuntiva che tieneconto della gravitagrave dello storico delle segnalazioni precedenti

12 Screenshots delle principali funzionalitagrave

Figura 11 Galleria principale Figura 12 Profilo Artista

Figura 13 Dettaglio Opera Figura 14 Commenti

3

Capitolo 2

Tecnologie e metodologie usate

In questo capitolo verranno presentate le principali tecnologie utilizzate specificandole funzionalitagrave delle tecnologie attualmente in uso e le motivazioni che ci hannospinto ad abbandonare alcune tecnologie In seguito verragrave presentata la metodologiautilizzata nella conduzione del progetto durante il periodo del workshop Google e larelativa organizzazione del lavoro tra i componenti del gruppo

21 Tecnologie in uso

211 Google App Engine

Google App Engine1 (GAE) egrave una Platform as a Service (PaaS) che consente dicreare ed eseguire applicazioni web sullrsquoinfrastruttura di Google GAE offre unascalabilitagrave automatica per le applicazioni a seconda del numero di richieste drsquousoper quella applicazione ed alloca in automatico piugrave risorse per gestire la doman-da addizionale Le applicazioni vengono eseguite in un ambiente sandbox sicuropermettendo la distribuzione delle richieste su piugrave server e la scalabilitagrave dei serverper soddisfare le richieste di traffico GAE supporta app scritte in una varietagrave dilinguaggi di programmazione come Java Python PHP e GoPer lo sviluppo di Art Everywhere si egrave scelto utilizzare il linguaggio di programma-zione Python e quindi di realizzare una Python web app che rappresenta il backenddellrsquoapplicazione

212 Google Cloud Endpoints

Google Cloud Endpoints2 (GCE) egrave un insieme di strumenti librerie e funzionalitagraveche consentono di generare API e librerie client da unrsquoapplicazione GAE (backend)per semplificare lrsquoaccesso client ai dati da altre applicazioni GCE utilizza la libreriaGoogle Protocol RPC un protocollo per lrsquoinvocazione remota di procedure HTTP-based Egrave possibile definire un servizio RPC in una singola classe Python che contieneun certo numero di metodi remoti dichiarati Ogni metodo remoto accetta un insiemespecifico di parametri come richiesta e restituisce una risposta specifica Questiparametri di richiesta e di risposta sono le classi definite dallrsquoutente note come

1httpscloudgooglecomappengine2httpscloudgooglecomappenginedocsjavaendpoints

21 Tecnologie in uso 4

Tabella 21 Parametri accettati da un metodo remoto

Request Message Class La classe del messaggio di richiesta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Response Message Class La classe del messaggio di risposta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Name Nome alternativo al metodoPath Il percorso URI da usare per accedere al

metodoHttp method Il metodo HTTP da usare (GET POST

ecc)

messaggi (ProtoRPC Messages) La Tabella 21 mostra i parametri accettati daimetodi remotiDopo aver completato la creazione dei vari metodi egrave possibile auto-generare lelibrerie per il client e quindi da importare nellrsquoapplicazione mobile Nel caso diArt Everywhere le librerie sono scritte in Java dato che si egrave scelto di realizzareunrsquoapplicazione Android Per autogenerare le librerie per il client egrave necessario usareil seguente comando da linea di comando

google_appengineendpointscfgpy ltcommandgt lttarget_langgt ltoptionsgt[class-name]

bull ltcommandgt puograve essere get_client_lib o get_discovery_doc

bull lttarget_langgt (usato solo con get_client_lib) specifica il tipo di pacchettoche si desidera creare Si egrave tenuti ad inserire il valore java per i client Javacome Android

bull ltoptiongt se fornito indica una o piugrave opzioni disponibili Ad esempio build-system specifica il tipo di bundle da produrre Si egrave tenuti a specificare gradleper i client Android

bull [class name] egrave il nome completo della classe

213 Google Cloud Datastore

Google Cloud Datastore3 (GCD) fornisce lrsquoarchiviazione dei dati senza richiedereuno schema fisso (NoSQL) garantendo una memorizzazione robusta e scalabile perle applicazioniA differenza dei tradizionali database relazionali GCD utilizza unrsquoarchitetturadistribuita per gestire automaticamente la scalabilitagrave fino a grandi insiemi di datiPoicheacute tutte le query sono servite da indici predefiniti i tipi di query che possonoessere eseguite sono piugrave restrittive rispetto a quelle consentite su un databaserelazionale con SQL In particolare non sono supportate le seguenti operazioni

3httpscloudgooglecomdatastoredocsconceptsoverview

21 Tecnologie in uso 5

join disuguaglianza di filtraggio su piugrave proprietagrave filtraggio dei dati sulla base deirisultati di una subqueryGCD salva gli oggetti di dati come entitagrave Unrsquoentitagrave ha una o piugrave proprietagrave icui valori possono essere uno dei diversi tipi di dati supportati per esempio unaproprietagrave puograve essere una stringa un numero intero o un riferimento ad unrsquoaltraentitagrave Ogni entitagrave egrave identificato dal suo genere che categorizza lrsquoentitagrave al fine dipoter effettuare query e una chiave che la identifica in modo univoco allrsquointerno delsuo genere

In Art Everywhere abbiamo utilizzato Python NDB Datastore API per po-ter definire modelli allrsquointerno di unrsquoapplicazione App Engine Un modello egrave unaclasse Python che agisce come una sorta di schema di database descrive un tipo didati in termini di proprietagrave

Nel capitolo 3 verragrave approfondita lrsquoanalisi concettuale del progetto che porteragrave alladefinizione del modello della base di dati utilizzata

214 Picasa Web Albums Data API

Le API di Picasa Web Albums consentono a siti web e applicazioni mobili di integrarsicon Picasa un software grafico per organizzare e modificare fotografie digitali evideo e di condividerle con altri utenti nei ldquoweb albumrdquoArt Everywhere memorizza tutte le immagini caricate dagli utenti su Picasa WebAlbums Usando lrsquoaccount Google dellrsquoapplicazione tutte le immagini (inviate daldispositivo mobile) vengono memorizzate dal backend in un web album chiamatoldquoArt Everywhererdquo e accessibile a chiunque tramite URL Tali URL vengono memo-rizzate nel database come una proprietagrave (url) della entitagrave PictureEntryDa App Engine lrsquoupload delle immagini su Picasa Web Album viene effettuatousando la libreria Google Data Python

215 Android

Android4 egrave un sistema operativo per dispositivi mobili sviluppato da Google Incbasato su kernel Linux e distribuito sotto i termini della licenza Apache 20 checonsente di modificare e distribuire liberamente il codice sorgentePer lo sviluppo di Art Everywhere egrave stato utilizzato Android Studio lrsquoIDE ufficialeper lo sviluppo di applicazioni Android basato su IntelliJ Idea e si egrave scelto di renderedisponibile lrsquoapplicazione a partire dalla versione sdk 15+ ovvero compatibile apartire dalla versione Android 40 (Ice Cream Sandwich)

216 Python

Python5 egrave un linguaggio di programmazione orientato agli oggetti e utilizzabile permolti tipi di sviluppo software Ersquo stato utilizzato per la realizzazione del backenddi Art Everyhwere sottoforma di una Python web app che interagisce con il web

4httpsitwikipediaorgwikiAndroid5httpswwwpythonorg

21 Tecnologie in uso 6

server GAE usando il protocollo WSGI6 In particolare egrave stato utilizzato webapp2un framework WSGI compatibile che consente di creare rapidamente sempliciapplicazioni web per il runtime di Python 27 Infatti la Python web app vieneeseguita da GAE utilizzando il linguaggio pre-caricato Python in un ambiente sicurosandbox Si tratta di un ambiente Python puro lrsquointerprete Python puograve eseguirequalsiasi codice Python ma non puograve caricare moduli Python che contengono codiceC

Inoltre in Art Everywhere il linguaggio di programmazione Python egrave statoutilizzato per codificare lrsquoalgoritmo di pattern recognition utilizzando la libreriaOpenCV (2110) il framework web Flask (218) e caricando il codice sul servizio dihosting PythonAnywhere (219)

217 OAuth 20

OAuth 20 egrave un protocollo aperto che garantisce ai service provider lrsquoaccesso daparte di terzi ai dati degli utenti proteggendo contemporanemente le loro credenzialiErsquo utilizzato dalle API di Google (ad esempio effettuare il login usando lrsquoaccountGoogle) per lrsquoautenticazione e le autorizzazioni e tutte le applicazioni seguono unpattern quando si accede ad un API di Google usando OAuth 20

bull ottenere le credenziali dalla Google Developer Console7 cioegrave il clientID e client secret che sono noti solamente a Google e alla propria applicazione

bull ottenere un token di accesso dal Server delle Autorizzazioni di Goo-gle prima che lrsquoapplicazione possa accedere ai dati privati tramite un API diGoogle si deve ottenere un token di accesso che concede lrsquoaccesso a tale APIUn parametro variabile di nome scope controlla lrsquoinsieme di risorse e delle ope-razioni che un token di accesso permette Se lrsquoutente concede lrsquoautorizzazioneil Server delle Autorizzazioni Google invia allrsquoapplicazione un token di accessoSe lrsquoutente non concede lrsquoautorizzazione il server restituisce un errore

bull inviare token di accesso ad uno specifico API in un header HTTP diautorizzazione

bull aggiornare il token di accesso se necessario poichegrave hanno una duratalimitata

218 Flask

Flask8 egrave un framework web scritto in Python e basato sullo strumento Werkzeug(libreria di utilitagrave HTTP e WSGI per Python) e con il motore template Jinja2 Flaskviene chiamato microframework percheacute non forza uno sviluppatore ad utilizzare un

6httpsitwikipediaorgwikiWeb_Server_Gateway_Interface Il Web Server Gateway In-terface (WSGI) egrave un protocollo di trasmissione che stabilisce e descrive comunicazioni ed interazionitra server ed applicazioni web scritte nel linguaggio Python Egrave quindi lrsquointerfaccia standard del webservice per la programmazione in Python

7httpsconsoledevelopersgooglecom8httpflaskpocooorgdocs010

22 Tecnologie abbandonate 7

particolare strumento o una libreria Non ha alcun livello di astrazione del databasela validazione dei form o qualsiasi altro componente in cui librerie di terze partipre-esistenti forniscono funzioni comuniIn Art Everywhere Flask egrave stato usato per realizzare unrsquoapplicazione web contenentelrsquoalgoritmo di pattern recognition per la similaritagrave tra immagini (53) e permetterecosigrave richieste RESTful effettuate dal backend

219 PythonAnywhere

PythonAnywhere9 egrave un servizio di hosting Web basato sul linguaggio di program-mazione Python Le applicazioni web ospitate possono essere scritte utilizzandoqualsiasi applicazione basata su framework WSGI con Art Everywhere abbiamoutilizzato Flask

2110 OpenCV

OpenCV10 egrave una libreria open source per software di computer vision e machinelearning OpenCV egrave stato realizzato per fornire una infrastruttura comune perapplicazioni di computer vision La libreria dispone metodi che possono essereutilizzati per rilevare e riconoscere i volti umani identificare oggetti classificare leazioni umane nei video tracciare movimenti di macchine su pista estrarre modelli3D di oggetti seguire i movimenti degli occhi riconoscere scenari eccDispone di interfacce C++ C Python Java e MATLAB e supporta WindowsLinux Android e Mac OS

In Art Everywhere tale libreria egrave stata utilizzata per realizzare lrsquoalgoritmodi pattern recognition per la similaritagrave tra immagini (53) utilizzando lrsquointerfacciaPython in ambiente Linux

22 Tecnologie abbandonate

221 Google BlobStore API

BlobStore API11 consente alle applicazioni di servire oggetti di dati chiamati blobche sono molto piugrave grandi della dimensione consentita per oggetti nel servizioDatastore come ad esempio i file video o immagini Blobs sono creati caricandoun file tramite una richiesta HTTP e cosigrave Blobstore crea un blob dal contenuto delfile e restituisce un riferimento per il blob chiamato blob key che potragrave poi essereutilizzato per servire il blobQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Per poter scrivere un blob direttamente sul Datastore egrave necessario lrsquoutilizzodi una low-level API messa a disposizione da Google Files API Essa perograve

9httpswwwpythonanywherecom10httpopencvorg11httpscloudgooglecomappenginedocsjavablobstore

23 Metodologia utilizzata ed organizzazione del lavoro 8

egrave stata deprecata da Google12 in favore dellrsquoutilizzo del solo Google CloudStorage il quale offre un servizio di scrittura file-like similare

bull Google Cloud Datastore offre uno spazio di archiviazione limitato per lrsquoarchi-viazione dei blobs (5GB di spazio free) che si sarebbe saturato facilmente seavessimo scelto di caricare le immagini direttamente su di esso

222 Google Cloud Storage

Google Cloud Storage13 egrave un servizio Internet per memorizzare i dati nel cloud diGoogleQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Spazio di archiviazione free inferiore rispetto a quello offerto da Picasa (5GBdi spazio offerti da GCS contro i 15GB di spazio gratuito offerti da GoogleDrive e di conseguenza messi a disposizione per Picasa)

bull Maggiore efficienza nellrsquoupload riscontrata nei test effettuati

23 Metodologia utilizzata ed organizzazione del lavoro

231 Milestones

Il workshop Google Technologies for Cloud and Web Development nel quale egrave statorealizzato il progetto Art Everywhere ha previsto delle milestones intermedieovvero dei momenti di verifica del progetto nei quali egrave stato presentato lo stato diavanzamento del lavoro ed egrave stato valutato dallo staff e dai mentors del workshop

Per la prima milestone (Gennaio 2015) ci siamo concentrati sullo studiodelle tecnologie utilizzate per sviluppare un Minimum Viable Product con lo scopodi presentare e testare le principali caratteristiche dellrsquoapplicazione In particolareabbiamo sviluppato lrsquoUpload delle immagini e la Galleria principale usata permostrare le opere caricate dagli artisti

Per la seconda milestone (Febbraio 2015) ci siamo focalizzati sui feedbackricevuti nella precedente e sui bisogni dei nostri utenti (gli artisti) sottoponendo unsondaggio a piugrave di 50 artisti Sono state aggiunte altre caratteristiche come la Paginadellrsquoartista il Dettaglio opera e i Filtri di ricerca opere La Release Candidate egravestata testata da 10 utenti I risultati dei sondaggi sono stati presentati nel Capitolo 6

Lo scopo della terza milestone (Marzo 2015) era quello di presentare lrsquointe-ro progetto funzionante Lrsquoapplicazione egrave stata completata realizzando la partesocial (Likes Commenti e Condivisione) migliorando lrsquoUser Interface adottando ilMaterial Design e lrsquousabilitagrave dellrsquoapplicazione attraverso dei sondaggi condotti suun campione di utenti

12httpscloudgooglecomappenginedocspythongooglestorage13httpscloudgooglecomstoragedocsoverview

23 Metodologia utilizzata ed organizzazione del lavoro 9

La quarta milestone (Aprile 2015) rappresentava la Final Submission ovve-ro la presentazione del progetto davanti ad una giuria composta oltre che dallostaff del workshop da ingegneri Google Allrsquoapplicazione sono state aggiunte lapossibilitagrave di modificareeliminare unrsquoopera drsquoarte modificareaggiornare il profilodellrsquoartista segnalare un commento o unrsquoopera offensiva e visualizzare la lista dellepersone che hanno messo un Like ad unrsquoopera

232 Divisione del lavoro

Il progetto egrave stato realizzato come lavoro di gruppo durante il workshop GoogleTechnologies for Cloud and Web Development e la suddivisione del lavoro egrave derivatadallrsquoarchitettura three-tier usata come riferimento ovvero interfaccia utente logicafunzionale (business logic) e gestione dei dati persistenti Ciascuno ha poi svi-luppato una o piugrave funzionalitagrave che ha approfondito nella propria relazione al progetto

Il mio personale contributo che viene presentato in queste pagine ha ri-guardato gli algoritmi usati per il trasferimento (uploaddownload) efficiente delleopere drsquoarte ovvero di immagini e per la loro compressione prevenendo unaperdita significativa della qualitagrave Inoltre viene presentato il sistema realizzatoper il riconoscimento di pattern finalizzato ad individuare similaritagrave tra le operedrsquoarte presenti nel database e con opere drsquoarte famose in modo da individuare falsidrsquoautore e prevenire eventuali furti di proprietagrave intellettuale

233 Tool utilizzati

Per coordinare il lavoro abbiamo utilizzato GitHub14 un servizio web di hosting perlo sviluppo di progetti software che ci ha permesso di creare una repository15 perpoter condividere il codice del progetto e lavorare cosigrave simultaneamente Inoltreabbiamo ritenuto molto utile la funzione Issues che rappresenta un ottimo modoper tenere traccia delle attivitagrave miglioramenti e bug del progetto

Abbiamo effettuato revisioni continue circa ogni 23 giorni con lo scopo diverificare lrsquoavanzamento del lavoro in base alle milestones fissate Ciograve egrave avvenutotramite incontri fisici o tramite il servizio di messaggistica istantanea e VoIPHangout16 Google Drive17 egrave stato utilizzato per lrsquoarchiviazione e lo scambio didocumenti condivisi come ad esempio immagini documentazioni diagrammidellrsquoarchitettura e di progettazioneecc Survio18 egrave un software online per crearegratuitamente questionari e sondaggi ed egrave cosigrave stato utilizzato per sottoporre iquestionari presentati nel Capitolo 6 Infine abbiamo utilizzato Android Studio19lrsquoIDE ufficiale per lo sviluppo di applicazioni Android e PyCharm20un ambiente disviluppo per la programmazione Python

14httpsgithubcom15httpsgithubcomdavideaurucciArtEverywhere16httpwwwgooglecom+learnmorehangouts17httpdrivegooglecom18httpwwwsurviocomit19httpsdeveloperandroidcomsdkindexhtml20httpswwwjetbrainscompycharm

10

Capitolo 3

Analisi concettuale del sistema

In questo capitolo viene approfondita la conoscenza del dominio di interesse inmaniera tale da poter descrivere in modo preciso e completo cosa tale progettodeve realizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

31 Modello Entitagrave-Relazioni

LikeEntry

PictureEntryArtistEntry

FlagEntry

TechniqueEntry

CommentEntry

BlacklistEntry

CommentFlag PictureFlag FlaggedPicture

FlaggedComment

PictureParent

CommentBy CommentParent

PictureTechnique

Figura 31 Schema ER dellrsquoapplicazione

311 Vincoli non esprimibili nello schema

Non sono esprimibili nello schema i seguenti vincoli esterni

bull Vincolo sul numero segnalazioni di Visitor forall v isin Istanze(IVisitor)esiste al piugrave un fd isin Istanze(IFlagged) con fd = ltUserv FlagEntryfgt

bull Vincolo sullrsquoattributo likes forall p isin Istanze(IPictureEntry) sia I = ltPictu-reEntryp ArtistEntry agt isin Istanze(ILikeEntry) | a isin Istanze(IArtistEntry)

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

Indice v

4 Progettazione del sistema 1741 Architettura del sistema 1742 Progettazione logica del data layer 18

421 Schema logico dei dati 18422 Ristrutturazione dello schema logico 19

5 Realizzazione del sistema 2351 Upload immagini 23

511 Sequence diagram 23512 Implementazione 24513 Aspetti particolari 27

52 Algoritmo di compressione immagini Whatsapp-like 27521 Stato dellrsquoarte 27522 Metodo proposto e implementazione 28523 Risultati ottenuti 31

53 Pattern recognition per similaritagrave tra opere drsquoarte 32531 Stato dellrsquoarte 32532 Metodo proposto e implementazione 33533 Risultati ottenuti 39

54 Download immagini 41541 Sequence diagram 41542 Implementazione 41543 Aspetti particolari 45

6 Distribuzione e Validazione 4661 Installazione applicazione 4662 Validazione 47

621 User-Centered Design 47622 Risultati sondaggi 48

A Appendice Immagini 55A1 Immagini per test di compressione 55A2 Opere drsquoarte 56A3 Immagini di ricerca 57

Ringraziamenti 58

vi

Introduzione

Il presente progetto di tesi egrave il frutto di un lavoro di gruppo svolto durante ilworkshop Google Technologies for Cloud and Web Development1 che ha portatoalla luce Art Everywhere un social network in cui gli artisti emergenti possonofarsi conoscere e condividere le proprie opere drsquoarteSi tratta di unrsquoapplicazione Android nata per soddisfare il bisogno di migliaiadi artisti emergenti di promuovere la propria arte in uno spazio completamentededicato a loro in cui egrave possibile venire a contatto con altri artisti critici eappassionati drsquoarte Questi possono giudicare tramite un like commentare econdividere le opere drsquoarte degli artisti registrati sulla piattaforma

Il workshop durato 5 mesi (Dicembre 2014 - Aprile 2015) egrave stato organiz-zato dallrsquoUniversitagrave La Sapienza in collaborazione con Google Tel Aviv e ha visto lapartecipazione di studenti delle tre universitagrave di Roma (La Sapienza Tor Vergata eRoma Tre) Gli studenti partecipanti sono stati divisi in gruppi ciascuno dei qualiha dovuto realizzare un progetto ovvero la progettazione e lo sviluppo di un sistemaweb live Si egrave trattato di un workshop incentrato sul cloud e sul web developmentutilizzando principalmente ma non esclusivamente strumenti e tecnologie diGoogle Il workshop ha previsto revisioni periodiche del progetto nelle quali egrave statopresentato lo stato di avanzamento del lavoro ed egrave stato valutato dallo staff e daimentors del workshop Al termine di esso il progetto ha ricevuto una valutazionefinale di 99100 Inoltre Art Everywhere ha ricevuto una menzione speciale duranteil keynote Entrepreneurship at scale di Yossi Matias (Vice Presidente di Google eAmministratore Delegato del centro RampD Google Israele) durante la conferenzainternazionale WWW2015 Entrepreneurs Track2 tenutasi a Firenze nel mese diMaggio 2015

Il gruppo che ha lavorato ad Art Everywhere egrave composto da 5 componentie ciascuno ha sviluppato una o piugrave funzionalitagrave che ha approfondito nella propriarelazione al progetto

Lrsquoobiettivo del mio progetto di tesi egrave quello di mostrare gli algoritmi usatiper il trasferimento (uploaddownload) efficiente delle opere drsquoarte cioegrave di immaginie per la loro compressione prevenendo una perdita significativa della qualitagrave eottenendo cosigrave un comportamento simile allrsquoalgoritmo di compressione immagini

1httpssitesgooglecomadisuniroma1itgoogle-technologies-for-cloud-and-web-development2httpwwwet2015org

vii

usato da WhatsappInoltre viene presentato il sistema realizzato per il riconoscimento di patternfinalizzato ad individuare similaritagrave tra le opere drsquoarte presenti nel database e conopere drsquoarte famose in modo da individuare falsi drsquoautore e prevenire eventualifurti di proprietagrave intellettuale

Struttura della tesiPer concludere la parte introduttiva diamo per ogni capitolo una breve sintesi

Capitolo 1 Viene presentata una descrizione completa e dettagliata della realtagrave diinteresse che mette in evidenza quali sono i dati che il sistema deve gestiree quali sono le principali funzionalitagrave includendo per alcune di esse unoscreenshot

Capitolo 2 Vengono mostrate le tecnologie adottate nel progetto soffermandosiin particolare su quelle innovative (ovvero non presentate nei corsi universi-tari) e su quelle in uso e specificando le motivazioni che ci hanno spinto adabbandonarne alcune Inoltre viene presentata la metodologia utilizzata nellaconduzione del progetto

Capitolo 3 Viene approfondita la conoscenza del dominio di interesse in manieratale da poter descrivere in modo preciso e completo cosa questo progetto deverealizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

Capitolo 4 Si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedelepossibile allo schema ER di partenza e che sia al tempo stesso efficiente

Capitolo 5 Viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inoltre ci si sofferma maggiormentesullo sviluppo degli algoritmi usati per il trasferimento efficiente e per lacompressione di immagini prevenendo una significativa perdita di qualitagraveInfine viene presentato il sistema realizzato per il riconoscimento di patterntra opere drsquoarte finalizzato ad individuare similaritagrave tra opere drsquoarte

Capitolo 6 Vengono date indicazioni su come installare lrsquoapplicazione e si descrivecome egrave stata effettuata la validazione e la fase di test dellrsquoapplicazione

1

Capitolo 1

Requisiti

In questo capitolo viene effettuata la raccolta e lrsquoanalisi dei requisti procedendoquindi alla definizione delle proprietagrave e delle funzionalitagrave del sistema Viene prodottauna descrizione completa e dettagliata dei dati che il sistema deve gestire e delleoperazioni da effettuare su di essi Infine vengono illustrati alcuni screenshots delleprincipali funzionalitagrave del sistema

11 Specifica dei requisitiSi vuole progettare lo schema concettuale corrispondente allrsquoapplicazione nella qualeinteressa memorizzare lrsquoemail di ogni utente Ogni utente puograve essere un visitatore(ed in tal caso non interessa memorizzare alcuna proprietagrave aggiuntiva) o un artistaper il quale si vuole memorizzare il nome il cognome unrsquoimmagine di profilo edeventualmente un nickname il suo sito la sua biografia e lrsquoeventuale id dellrsquoimmaginedi profilo (in caso essa venga sostituita) Egrave di interesse per lrsquoapplicazione memorizzareinformazioni sulle opere drsquoarte caricate dagli artisti Nello specifico interessano lrsquourldella immagine il suo identificativo di caricamento la data e ora di caricamentoil titolo ed eventualmente una descrizione il luogo in cui egrave stata realizzata e lesue dimensioni Si vuole anche memorizzare lrsquoemail dellrsquoartista che ha caricatolrsquoopera Si vogliono anche memorizzare le tecniche pittoriche delle quali interessamemorizzare il nome (univoco) e che sono identificate per mezzo di una chiavenumerica Ogni opera drsquoarte caricata deve necessariamente specificare il tipo ditecnica pittorica utilizzata Le opere drsquoarte possono ricevere apprezzamenti e critichesotto forma di likes e commenti Di ogni like memorizzato interessa sapere chi egravelrsquoartista che lo ha apposto lrsquoopera drsquoarte coinvolta e la data e ora in cui esso egravestato apposto Per ogni opera drsquoarte egrave di interesse memorizzare anche il numerodi like Ogni commento egrave identificato da un codice numerico e di esso interessa iltesto del commento la data e ora in cui esso egrave stato apposto lrsquoutente che lo haapposto e lrsquoopera drsquoarte coinvolta Opere drsquoarte e commenti possono essere giudicatidagli artisti registrati come inappropriati A tale scopo egrave possibile segnalare uncommento o unrsquoopera drsquoarte e della segnalazione interessa sapere qual egrave il contenutocoinvolto lrsquoartista segnalante e lrsquoutente segnalato Ogni artista puograve segnalare uncerto contenuto unrsquounica volta Inoltre si vuole tenere traccia degli utenti che acausa delle segnalazioni ricevute sono finiti sulla ldquolista nerardquo dellrsquoapplicazione e

12 Screenshots delle principali funzionalitagrave 2

che non possono piugrave utilizzarla Di una entry della lista nera interessa sapere chi egravelrsquoutente coinvolto In particolare un utente visitatore finisce in lista nera alla primasegnalazione ricevuta mentre un utente artista finisce in lista nera solo dopo cheavendo valutato le segnalazioni ricevute si ritiene che esso debba essere inserito inessa A tale scopo per lrsquoartista si memorizza una proprietagrave aggiuntiva che tieneconto della gravitagrave dello storico delle segnalazioni precedenti

12 Screenshots delle principali funzionalitagrave

Figura 11 Galleria principale Figura 12 Profilo Artista

Figura 13 Dettaglio Opera Figura 14 Commenti

3

Capitolo 2

Tecnologie e metodologie usate

In questo capitolo verranno presentate le principali tecnologie utilizzate specificandole funzionalitagrave delle tecnologie attualmente in uso e le motivazioni che ci hannospinto ad abbandonare alcune tecnologie In seguito verragrave presentata la metodologiautilizzata nella conduzione del progetto durante il periodo del workshop Google e larelativa organizzazione del lavoro tra i componenti del gruppo

21 Tecnologie in uso

211 Google App Engine

Google App Engine1 (GAE) egrave una Platform as a Service (PaaS) che consente dicreare ed eseguire applicazioni web sullrsquoinfrastruttura di Google GAE offre unascalabilitagrave automatica per le applicazioni a seconda del numero di richieste drsquousoper quella applicazione ed alloca in automatico piugrave risorse per gestire la doman-da addizionale Le applicazioni vengono eseguite in un ambiente sandbox sicuropermettendo la distribuzione delle richieste su piugrave server e la scalabilitagrave dei serverper soddisfare le richieste di traffico GAE supporta app scritte in una varietagrave dilinguaggi di programmazione come Java Python PHP e GoPer lo sviluppo di Art Everywhere si egrave scelto utilizzare il linguaggio di programma-zione Python e quindi di realizzare una Python web app che rappresenta il backenddellrsquoapplicazione

212 Google Cloud Endpoints

Google Cloud Endpoints2 (GCE) egrave un insieme di strumenti librerie e funzionalitagraveche consentono di generare API e librerie client da unrsquoapplicazione GAE (backend)per semplificare lrsquoaccesso client ai dati da altre applicazioni GCE utilizza la libreriaGoogle Protocol RPC un protocollo per lrsquoinvocazione remota di procedure HTTP-based Egrave possibile definire un servizio RPC in una singola classe Python che contieneun certo numero di metodi remoti dichiarati Ogni metodo remoto accetta un insiemespecifico di parametri come richiesta e restituisce una risposta specifica Questiparametri di richiesta e di risposta sono le classi definite dallrsquoutente note come

1httpscloudgooglecomappengine2httpscloudgooglecomappenginedocsjavaendpoints

21 Tecnologie in uso 4

Tabella 21 Parametri accettati da un metodo remoto

Request Message Class La classe del messaggio di richiesta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Response Message Class La classe del messaggio di risposta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Name Nome alternativo al metodoPath Il percorso URI da usare per accedere al

metodoHttp method Il metodo HTTP da usare (GET POST

ecc)

messaggi (ProtoRPC Messages) La Tabella 21 mostra i parametri accettati daimetodi remotiDopo aver completato la creazione dei vari metodi egrave possibile auto-generare lelibrerie per il client e quindi da importare nellrsquoapplicazione mobile Nel caso diArt Everywhere le librerie sono scritte in Java dato che si egrave scelto di realizzareunrsquoapplicazione Android Per autogenerare le librerie per il client egrave necessario usareil seguente comando da linea di comando

google_appengineendpointscfgpy ltcommandgt lttarget_langgt ltoptionsgt[class-name]

bull ltcommandgt puograve essere get_client_lib o get_discovery_doc

bull lttarget_langgt (usato solo con get_client_lib) specifica il tipo di pacchettoche si desidera creare Si egrave tenuti ad inserire il valore java per i client Javacome Android

bull ltoptiongt se fornito indica una o piugrave opzioni disponibili Ad esempio build-system specifica il tipo di bundle da produrre Si egrave tenuti a specificare gradleper i client Android

bull [class name] egrave il nome completo della classe

213 Google Cloud Datastore

Google Cloud Datastore3 (GCD) fornisce lrsquoarchiviazione dei dati senza richiedereuno schema fisso (NoSQL) garantendo una memorizzazione robusta e scalabile perle applicazioniA differenza dei tradizionali database relazionali GCD utilizza unrsquoarchitetturadistribuita per gestire automaticamente la scalabilitagrave fino a grandi insiemi di datiPoicheacute tutte le query sono servite da indici predefiniti i tipi di query che possonoessere eseguite sono piugrave restrittive rispetto a quelle consentite su un databaserelazionale con SQL In particolare non sono supportate le seguenti operazioni

3httpscloudgooglecomdatastoredocsconceptsoverview

21 Tecnologie in uso 5

join disuguaglianza di filtraggio su piugrave proprietagrave filtraggio dei dati sulla base deirisultati di una subqueryGCD salva gli oggetti di dati come entitagrave Unrsquoentitagrave ha una o piugrave proprietagrave icui valori possono essere uno dei diversi tipi di dati supportati per esempio unaproprietagrave puograve essere una stringa un numero intero o un riferimento ad unrsquoaltraentitagrave Ogni entitagrave egrave identificato dal suo genere che categorizza lrsquoentitagrave al fine dipoter effettuare query e una chiave che la identifica in modo univoco allrsquointerno delsuo genere

In Art Everywhere abbiamo utilizzato Python NDB Datastore API per po-ter definire modelli allrsquointerno di unrsquoapplicazione App Engine Un modello egrave unaclasse Python che agisce come una sorta di schema di database descrive un tipo didati in termini di proprietagrave

Nel capitolo 3 verragrave approfondita lrsquoanalisi concettuale del progetto che porteragrave alladefinizione del modello della base di dati utilizzata

214 Picasa Web Albums Data API

Le API di Picasa Web Albums consentono a siti web e applicazioni mobili di integrarsicon Picasa un software grafico per organizzare e modificare fotografie digitali evideo e di condividerle con altri utenti nei ldquoweb albumrdquoArt Everywhere memorizza tutte le immagini caricate dagli utenti su Picasa WebAlbums Usando lrsquoaccount Google dellrsquoapplicazione tutte le immagini (inviate daldispositivo mobile) vengono memorizzate dal backend in un web album chiamatoldquoArt Everywhererdquo e accessibile a chiunque tramite URL Tali URL vengono memo-rizzate nel database come una proprietagrave (url) della entitagrave PictureEntryDa App Engine lrsquoupload delle immagini su Picasa Web Album viene effettuatousando la libreria Google Data Python

215 Android

Android4 egrave un sistema operativo per dispositivi mobili sviluppato da Google Incbasato su kernel Linux e distribuito sotto i termini della licenza Apache 20 checonsente di modificare e distribuire liberamente il codice sorgentePer lo sviluppo di Art Everywhere egrave stato utilizzato Android Studio lrsquoIDE ufficialeper lo sviluppo di applicazioni Android basato su IntelliJ Idea e si egrave scelto di renderedisponibile lrsquoapplicazione a partire dalla versione sdk 15+ ovvero compatibile apartire dalla versione Android 40 (Ice Cream Sandwich)

216 Python

Python5 egrave un linguaggio di programmazione orientato agli oggetti e utilizzabile permolti tipi di sviluppo software Ersquo stato utilizzato per la realizzazione del backenddi Art Everyhwere sottoforma di una Python web app che interagisce con il web

4httpsitwikipediaorgwikiAndroid5httpswwwpythonorg

21 Tecnologie in uso 6

server GAE usando il protocollo WSGI6 In particolare egrave stato utilizzato webapp2un framework WSGI compatibile che consente di creare rapidamente sempliciapplicazioni web per il runtime di Python 27 Infatti la Python web app vieneeseguita da GAE utilizzando il linguaggio pre-caricato Python in un ambiente sicurosandbox Si tratta di un ambiente Python puro lrsquointerprete Python puograve eseguirequalsiasi codice Python ma non puograve caricare moduli Python che contengono codiceC

Inoltre in Art Everywhere il linguaggio di programmazione Python egrave statoutilizzato per codificare lrsquoalgoritmo di pattern recognition utilizzando la libreriaOpenCV (2110) il framework web Flask (218) e caricando il codice sul servizio dihosting PythonAnywhere (219)

217 OAuth 20

OAuth 20 egrave un protocollo aperto che garantisce ai service provider lrsquoaccesso daparte di terzi ai dati degli utenti proteggendo contemporanemente le loro credenzialiErsquo utilizzato dalle API di Google (ad esempio effettuare il login usando lrsquoaccountGoogle) per lrsquoautenticazione e le autorizzazioni e tutte le applicazioni seguono unpattern quando si accede ad un API di Google usando OAuth 20

bull ottenere le credenziali dalla Google Developer Console7 cioegrave il clientID e client secret che sono noti solamente a Google e alla propria applicazione

bull ottenere un token di accesso dal Server delle Autorizzazioni di Goo-gle prima che lrsquoapplicazione possa accedere ai dati privati tramite un API diGoogle si deve ottenere un token di accesso che concede lrsquoaccesso a tale APIUn parametro variabile di nome scope controlla lrsquoinsieme di risorse e delle ope-razioni che un token di accesso permette Se lrsquoutente concede lrsquoautorizzazioneil Server delle Autorizzazioni Google invia allrsquoapplicazione un token di accessoSe lrsquoutente non concede lrsquoautorizzazione il server restituisce un errore

bull inviare token di accesso ad uno specifico API in un header HTTP diautorizzazione

bull aggiornare il token di accesso se necessario poichegrave hanno una duratalimitata

218 Flask

Flask8 egrave un framework web scritto in Python e basato sullo strumento Werkzeug(libreria di utilitagrave HTTP e WSGI per Python) e con il motore template Jinja2 Flaskviene chiamato microframework percheacute non forza uno sviluppatore ad utilizzare un

6httpsitwikipediaorgwikiWeb_Server_Gateway_Interface Il Web Server Gateway In-terface (WSGI) egrave un protocollo di trasmissione che stabilisce e descrive comunicazioni ed interazionitra server ed applicazioni web scritte nel linguaggio Python Egrave quindi lrsquointerfaccia standard del webservice per la programmazione in Python

7httpsconsoledevelopersgooglecom8httpflaskpocooorgdocs010

22 Tecnologie abbandonate 7

particolare strumento o una libreria Non ha alcun livello di astrazione del databasela validazione dei form o qualsiasi altro componente in cui librerie di terze partipre-esistenti forniscono funzioni comuniIn Art Everywhere Flask egrave stato usato per realizzare unrsquoapplicazione web contenentelrsquoalgoritmo di pattern recognition per la similaritagrave tra immagini (53) e permetterecosigrave richieste RESTful effettuate dal backend

219 PythonAnywhere

PythonAnywhere9 egrave un servizio di hosting Web basato sul linguaggio di program-mazione Python Le applicazioni web ospitate possono essere scritte utilizzandoqualsiasi applicazione basata su framework WSGI con Art Everywhere abbiamoutilizzato Flask

2110 OpenCV

OpenCV10 egrave una libreria open source per software di computer vision e machinelearning OpenCV egrave stato realizzato per fornire una infrastruttura comune perapplicazioni di computer vision La libreria dispone metodi che possono essereutilizzati per rilevare e riconoscere i volti umani identificare oggetti classificare leazioni umane nei video tracciare movimenti di macchine su pista estrarre modelli3D di oggetti seguire i movimenti degli occhi riconoscere scenari eccDispone di interfacce C++ C Python Java e MATLAB e supporta WindowsLinux Android e Mac OS

In Art Everywhere tale libreria egrave stata utilizzata per realizzare lrsquoalgoritmodi pattern recognition per la similaritagrave tra immagini (53) utilizzando lrsquointerfacciaPython in ambiente Linux

22 Tecnologie abbandonate

221 Google BlobStore API

BlobStore API11 consente alle applicazioni di servire oggetti di dati chiamati blobche sono molto piugrave grandi della dimensione consentita per oggetti nel servizioDatastore come ad esempio i file video o immagini Blobs sono creati caricandoun file tramite una richiesta HTTP e cosigrave Blobstore crea un blob dal contenuto delfile e restituisce un riferimento per il blob chiamato blob key che potragrave poi essereutilizzato per servire il blobQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Per poter scrivere un blob direttamente sul Datastore egrave necessario lrsquoutilizzodi una low-level API messa a disposizione da Google Files API Essa perograve

9httpswwwpythonanywherecom10httpopencvorg11httpscloudgooglecomappenginedocsjavablobstore

23 Metodologia utilizzata ed organizzazione del lavoro 8

egrave stata deprecata da Google12 in favore dellrsquoutilizzo del solo Google CloudStorage il quale offre un servizio di scrittura file-like similare

bull Google Cloud Datastore offre uno spazio di archiviazione limitato per lrsquoarchi-viazione dei blobs (5GB di spazio free) che si sarebbe saturato facilmente seavessimo scelto di caricare le immagini direttamente su di esso

222 Google Cloud Storage

Google Cloud Storage13 egrave un servizio Internet per memorizzare i dati nel cloud diGoogleQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Spazio di archiviazione free inferiore rispetto a quello offerto da Picasa (5GBdi spazio offerti da GCS contro i 15GB di spazio gratuito offerti da GoogleDrive e di conseguenza messi a disposizione per Picasa)

bull Maggiore efficienza nellrsquoupload riscontrata nei test effettuati

23 Metodologia utilizzata ed organizzazione del lavoro

231 Milestones

Il workshop Google Technologies for Cloud and Web Development nel quale egrave statorealizzato il progetto Art Everywhere ha previsto delle milestones intermedieovvero dei momenti di verifica del progetto nei quali egrave stato presentato lo stato diavanzamento del lavoro ed egrave stato valutato dallo staff e dai mentors del workshop

Per la prima milestone (Gennaio 2015) ci siamo concentrati sullo studiodelle tecnologie utilizzate per sviluppare un Minimum Viable Product con lo scopodi presentare e testare le principali caratteristiche dellrsquoapplicazione In particolareabbiamo sviluppato lrsquoUpload delle immagini e la Galleria principale usata permostrare le opere caricate dagli artisti

Per la seconda milestone (Febbraio 2015) ci siamo focalizzati sui feedbackricevuti nella precedente e sui bisogni dei nostri utenti (gli artisti) sottoponendo unsondaggio a piugrave di 50 artisti Sono state aggiunte altre caratteristiche come la Paginadellrsquoartista il Dettaglio opera e i Filtri di ricerca opere La Release Candidate egravestata testata da 10 utenti I risultati dei sondaggi sono stati presentati nel Capitolo 6

Lo scopo della terza milestone (Marzo 2015) era quello di presentare lrsquointe-ro progetto funzionante Lrsquoapplicazione egrave stata completata realizzando la partesocial (Likes Commenti e Condivisione) migliorando lrsquoUser Interface adottando ilMaterial Design e lrsquousabilitagrave dellrsquoapplicazione attraverso dei sondaggi condotti suun campione di utenti

12httpscloudgooglecomappenginedocspythongooglestorage13httpscloudgooglecomstoragedocsoverview

23 Metodologia utilizzata ed organizzazione del lavoro 9

La quarta milestone (Aprile 2015) rappresentava la Final Submission ovve-ro la presentazione del progetto davanti ad una giuria composta oltre che dallostaff del workshop da ingegneri Google Allrsquoapplicazione sono state aggiunte lapossibilitagrave di modificareeliminare unrsquoopera drsquoarte modificareaggiornare il profilodellrsquoartista segnalare un commento o unrsquoopera offensiva e visualizzare la lista dellepersone che hanno messo un Like ad unrsquoopera

232 Divisione del lavoro

Il progetto egrave stato realizzato come lavoro di gruppo durante il workshop GoogleTechnologies for Cloud and Web Development e la suddivisione del lavoro egrave derivatadallrsquoarchitettura three-tier usata come riferimento ovvero interfaccia utente logicafunzionale (business logic) e gestione dei dati persistenti Ciascuno ha poi svi-luppato una o piugrave funzionalitagrave che ha approfondito nella propria relazione al progetto

Il mio personale contributo che viene presentato in queste pagine ha ri-guardato gli algoritmi usati per il trasferimento (uploaddownload) efficiente delleopere drsquoarte ovvero di immagini e per la loro compressione prevenendo unaperdita significativa della qualitagrave Inoltre viene presentato il sistema realizzatoper il riconoscimento di pattern finalizzato ad individuare similaritagrave tra le operedrsquoarte presenti nel database e con opere drsquoarte famose in modo da individuare falsidrsquoautore e prevenire eventuali furti di proprietagrave intellettuale

233 Tool utilizzati

Per coordinare il lavoro abbiamo utilizzato GitHub14 un servizio web di hosting perlo sviluppo di progetti software che ci ha permesso di creare una repository15 perpoter condividere il codice del progetto e lavorare cosigrave simultaneamente Inoltreabbiamo ritenuto molto utile la funzione Issues che rappresenta un ottimo modoper tenere traccia delle attivitagrave miglioramenti e bug del progetto

Abbiamo effettuato revisioni continue circa ogni 23 giorni con lo scopo diverificare lrsquoavanzamento del lavoro in base alle milestones fissate Ciograve egrave avvenutotramite incontri fisici o tramite il servizio di messaggistica istantanea e VoIPHangout16 Google Drive17 egrave stato utilizzato per lrsquoarchiviazione e lo scambio didocumenti condivisi come ad esempio immagini documentazioni diagrammidellrsquoarchitettura e di progettazioneecc Survio18 egrave un software online per crearegratuitamente questionari e sondaggi ed egrave cosigrave stato utilizzato per sottoporre iquestionari presentati nel Capitolo 6 Infine abbiamo utilizzato Android Studio19lrsquoIDE ufficiale per lo sviluppo di applicazioni Android e PyCharm20un ambiente disviluppo per la programmazione Python

14httpsgithubcom15httpsgithubcomdavideaurucciArtEverywhere16httpwwwgooglecom+learnmorehangouts17httpdrivegooglecom18httpwwwsurviocomit19httpsdeveloperandroidcomsdkindexhtml20httpswwwjetbrainscompycharm

10

Capitolo 3

Analisi concettuale del sistema

In questo capitolo viene approfondita la conoscenza del dominio di interesse inmaniera tale da poter descrivere in modo preciso e completo cosa tale progettodeve realizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

31 Modello Entitagrave-Relazioni

LikeEntry

PictureEntryArtistEntry

FlagEntry

TechniqueEntry

CommentEntry

BlacklistEntry

CommentFlag PictureFlag FlaggedPicture

FlaggedComment

PictureParent

CommentBy CommentParent

PictureTechnique

Figura 31 Schema ER dellrsquoapplicazione

311 Vincoli non esprimibili nello schema

Non sono esprimibili nello schema i seguenti vincoli esterni

bull Vincolo sul numero segnalazioni di Visitor forall v isin Istanze(IVisitor)esiste al piugrave un fd isin Istanze(IFlagged) con fd = ltUserv FlagEntryfgt

bull Vincolo sullrsquoattributo likes forall p isin Istanze(IPictureEntry) sia I = ltPictu-reEntryp ArtistEntry agt isin Istanze(ILikeEntry) | a isin Istanze(IArtistEntry)

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

vi

Introduzione

Il presente progetto di tesi egrave il frutto di un lavoro di gruppo svolto durante ilworkshop Google Technologies for Cloud and Web Development1 che ha portatoalla luce Art Everywhere un social network in cui gli artisti emergenti possonofarsi conoscere e condividere le proprie opere drsquoarteSi tratta di unrsquoapplicazione Android nata per soddisfare il bisogno di migliaiadi artisti emergenti di promuovere la propria arte in uno spazio completamentededicato a loro in cui egrave possibile venire a contatto con altri artisti critici eappassionati drsquoarte Questi possono giudicare tramite un like commentare econdividere le opere drsquoarte degli artisti registrati sulla piattaforma

Il workshop durato 5 mesi (Dicembre 2014 - Aprile 2015) egrave stato organiz-zato dallrsquoUniversitagrave La Sapienza in collaborazione con Google Tel Aviv e ha visto lapartecipazione di studenti delle tre universitagrave di Roma (La Sapienza Tor Vergata eRoma Tre) Gli studenti partecipanti sono stati divisi in gruppi ciascuno dei qualiha dovuto realizzare un progetto ovvero la progettazione e lo sviluppo di un sistemaweb live Si egrave trattato di un workshop incentrato sul cloud e sul web developmentutilizzando principalmente ma non esclusivamente strumenti e tecnologie diGoogle Il workshop ha previsto revisioni periodiche del progetto nelle quali egrave statopresentato lo stato di avanzamento del lavoro ed egrave stato valutato dallo staff e daimentors del workshop Al termine di esso il progetto ha ricevuto una valutazionefinale di 99100 Inoltre Art Everywhere ha ricevuto una menzione speciale duranteil keynote Entrepreneurship at scale di Yossi Matias (Vice Presidente di Google eAmministratore Delegato del centro RampD Google Israele) durante la conferenzainternazionale WWW2015 Entrepreneurs Track2 tenutasi a Firenze nel mese diMaggio 2015

Il gruppo che ha lavorato ad Art Everywhere egrave composto da 5 componentie ciascuno ha sviluppato una o piugrave funzionalitagrave che ha approfondito nella propriarelazione al progetto

Lrsquoobiettivo del mio progetto di tesi egrave quello di mostrare gli algoritmi usatiper il trasferimento (uploaddownload) efficiente delle opere drsquoarte cioegrave di immaginie per la loro compressione prevenendo una perdita significativa della qualitagrave eottenendo cosigrave un comportamento simile allrsquoalgoritmo di compressione immagini

1httpssitesgooglecomadisuniroma1itgoogle-technologies-for-cloud-and-web-development2httpwwwet2015org

vii

usato da WhatsappInoltre viene presentato il sistema realizzato per il riconoscimento di patternfinalizzato ad individuare similaritagrave tra le opere drsquoarte presenti nel database e conopere drsquoarte famose in modo da individuare falsi drsquoautore e prevenire eventualifurti di proprietagrave intellettuale

Struttura della tesiPer concludere la parte introduttiva diamo per ogni capitolo una breve sintesi

Capitolo 1 Viene presentata una descrizione completa e dettagliata della realtagrave diinteresse che mette in evidenza quali sono i dati che il sistema deve gestiree quali sono le principali funzionalitagrave includendo per alcune di esse unoscreenshot

Capitolo 2 Vengono mostrate le tecnologie adottate nel progetto soffermandosiin particolare su quelle innovative (ovvero non presentate nei corsi universi-tari) e su quelle in uso e specificando le motivazioni che ci hanno spinto adabbandonarne alcune Inoltre viene presentata la metodologia utilizzata nellaconduzione del progetto

Capitolo 3 Viene approfondita la conoscenza del dominio di interesse in manieratale da poter descrivere in modo preciso e completo cosa questo progetto deverealizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

Capitolo 4 Si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedelepossibile allo schema ER di partenza e che sia al tempo stesso efficiente

Capitolo 5 Viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inoltre ci si sofferma maggiormentesullo sviluppo degli algoritmi usati per il trasferimento efficiente e per lacompressione di immagini prevenendo una significativa perdita di qualitagraveInfine viene presentato il sistema realizzato per il riconoscimento di patterntra opere drsquoarte finalizzato ad individuare similaritagrave tra opere drsquoarte

Capitolo 6 Vengono date indicazioni su come installare lrsquoapplicazione e si descrivecome egrave stata effettuata la validazione e la fase di test dellrsquoapplicazione

1

Capitolo 1

Requisiti

In questo capitolo viene effettuata la raccolta e lrsquoanalisi dei requisti procedendoquindi alla definizione delle proprietagrave e delle funzionalitagrave del sistema Viene prodottauna descrizione completa e dettagliata dei dati che il sistema deve gestire e delleoperazioni da effettuare su di essi Infine vengono illustrati alcuni screenshots delleprincipali funzionalitagrave del sistema

11 Specifica dei requisitiSi vuole progettare lo schema concettuale corrispondente allrsquoapplicazione nella qualeinteressa memorizzare lrsquoemail di ogni utente Ogni utente puograve essere un visitatore(ed in tal caso non interessa memorizzare alcuna proprietagrave aggiuntiva) o un artistaper il quale si vuole memorizzare il nome il cognome unrsquoimmagine di profilo edeventualmente un nickname il suo sito la sua biografia e lrsquoeventuale id dellrsquoimmaginedi profilo (in caso essa venga sostituita) Egrave di interesse per lrsquoapplicazione memorizzareinformazioni sulle opere drsquoarte caricate dagli artisti Nello specifico interessano lrsquourldella immagine il suo identificativo di caricamento la data e ora di caricamentoil titolo ed eventualmente una descrizione il luogo in cui egrave stata realizzata e lesue dimensioni Si vuole anche memorizzare lrsquoemail dellrsquoartista che ha caricatolrsquoopera Si vogliono anche memorizzare le tecniche pittoriche delle quali interessamemorizzare il nome (univoco) e che sono identificate per mezzo di una chiavenumerica Ogni opera drsquoarte caricata deve necessariamente specificare il tipo ditecnica pittorica utilizzata Le opere drsquoarte possono ricevere apprezzamenti e critichesotto forma di likes e commenti Di ogni like memorizzato interessa sapere chi egravelrsquoartista che lo ha apposto lrsquoopera drsquoarte coinvolta e la data e ora in cui esso egravestato apposto Per ogni opera drsquoarte egrave di interesse memorizzare anche il numerodi like Ogni commento egrave identificato da un codice numerico e di esso interessa iltesto del commento la data e ora in cui esso egrave stato apposto lrsquoutente che lo haapposto e lrsquoopera drsquoarte coinvolta Opere drsquoarte e commenti possono essere giudicatidagli artisti registrati come inappropriati A tale scopo egrave possibile segnalare uncommento o unrsquoopera drsquoarte e della segnalazione interessa sapere qual egrave il contenutocoinvolto lrsquoartista segnalante e lrsquoutente segnalato Ogni artista puograve segnalare uncerto contenuto unrsquounica volta Inoltre si vuole tenere traccia degli utenti che acausa delle segnalazioni ricevute sono finiti sulla ldquolista nerardquo dellrsquoapplicazione e

12 Screenshots delle principali funzionalitagrave 2

che non possono piugrave utilizzarla Di una entry della lista nera interessa sapere chi egravelrsquoutente coinvolto In particolare un utente visitatore finisce in lista nera alla primasegnalazione ricevuta mentre un utente artista finisce in lista nera solo dopo cheavendo valutato le segnalazioni ricevute si ritiene che esso debba essere inserito inessa A tale scopo per lrsquoartista si memorizza una proprietagrave aggiuntiva che tieneconto della gravitagrave dello storico delle segnalazioni precedenti

12 Screenshots delle principali funzionalitagrave

Figura 11 Galleria principale Figura 12 Profilo Artista

Figura 13 Dettaglio Opera Figura 14 Commenti

3

Capitolo 2

Tecnologie e metodologie usate

In questo capitolo verranno presentate le principali tecnologie utilizzate specificandole funzionalitagrave delle tecnologie attualmente in uso e le motivazioni che ci hannospinto ad abbandonare alcune tecnologie In seguito verragrave presentata la metodologiautilizzata nella conduzione del progetto durante il periodo del workshop Google e larelativa organizzazione del lavoro tra i componenti del gruppo

21 Tecnologie in uso

211 Google App Engine

Google App Engine1 (GAE) egrave una Platform as a Service (PaaS) che consente dicreare ed eseguire applicazioni web sullrsquoinfrastruttura di Google GAE offre unascalabilitagrave automatica per le applicazioni a seconda del numero di richieste drsquousoper quella applicazione ed alloca in automatico piugrave risorse per gestire la doman-da addizionale Le applicazioni vengono eseguite in un ambiente sandbox sicuropermettendo la distribuzione delle richieste su piugrave server e la scalabilitagrave dei serverper soddisfare le richieste di traffico GAE supporta app scritte in una varietagrave dilinguaggi di programmazione come Java Python PHP e GoPer lo sviluppo di Art Everywhere si egrave scelto utilizzare il linguaggio di programma-zione Python e quindi di realizzare una Python web app che rappresenta il backenddellrsquoapplicazione

212 Google Cloud Endpoints

Google Cloud Endpoints2 (GCE) egrave un insieme di strumenti librerie e funzionalitagraveche consentono di generare API e librerie client da unrsquoapplicazione GAE (backend)per semplificare lrsquoaccesso client ai dati da altre applicazioni GCE utilizza la libreriaGoogle Protocol RPC un protocollo per lrsquoinvocazione remota di procedure HTTP-based Egrave possibile definire un servizio RPC in una singola classe Python che contieneun certo numero di metodi remoti dichiarati Ogni metodo remoto accetta un insiemespecifico di parametri come richiesta e restituisce una risposta specifica Questiparametri di richiesta e di risposta sono le classi definite dallrsquoutente note come

1httpscloudgooglecomappengine2httpscloudgooglecomappenginedocsjavaendpoints

21 Tecnologie in uso 4

Tabella 21 Parametri accettati da un metodo remoto

Request Message Class La classe del messaggio di richiesta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Response Message Class La classe del messaggio di risposta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Name Nome alternativo al metodoPath Il percorso URI da usare per accedere al

metodoHttp method Il metodo HTTP da usare (GET POST

ecc)

messaggi (ProtoRPC Messages) La Tabella 21 mostra i parametri accettati daimetodi remotiDopo aver completato la creazione dei vari metodi egrave possibile auto-generare lelibrerie per il client e quindi da importare nellrsquoapplicazione mobile Nel caso diArt Everywhere le librerie sono scritte in Java dato che si egrave scelto di realizzareunrsquoapplicazione Android Per autogenerare le librerie per il client egrave necessario usareil seguente comando da linea di comando

google_appengineendpointscfgpy ltcommandgt lttarget_langgt ltoptionsgt[class-name]

bull ltcommandgt puograve essere get_client_lib o get_discovery_doc

bull lttarget_langgt (usato solo con get_client_lib) specifica il tipo di pacchettoche si desidera creare Si egrave tenuti ad inserire il valore java per i client Javacome Android

bull ltoptiongt se fornito indica una o piugrave opzioni disponibili Ad esempio build-system specifica il tipo di bundle da produrre Si egrave tenuti a specificare gradleper i client Android

bull [class name] egrave il nome completo della classe

213 Google Cloud Datastore

Google Cloud Datastore3 (GCD) fornisce lrsquoarchiviazione dei dati senza richiedereuno schema fisso (NoSQL) garantendo una memorizzazione robusta e scalabile perle applicazioniA differenza dei tradizionali database relazionali GCD utilizza unrsquoarchitetturadistribuita per gestire automaticamente la scalabilitagrave fino a grandi insiemi di datiPoicheacute tutte le query sono servite da indici predefiniti i tipi di query che possonoessere eseguite sono piugrave restrittive rispetto a quelle consentite su un databaserelazionale con SQL In particolare non sono supportate le seguenti operazioni

3httpscloudgooglecomdatastoredocsconceptsoverview

21 Tecnologie in uso 5

join disuguaglianza di filtraggio su piugrave proprietagrave filtraggio dei dati sulla base deirisultati di una subqueryGCD salva gli oggetti di dati come entitagrave Unrsquoentitagrave ha una o piugrave proprietagrave icui valori possono essere uno dei diversi tipi di dati supportati per esempio unaproprietagrave puograve essere una stringa un numero intero o un riferimento ad unrsquoaltraentitagrave Ogni entitagrave egrave identificato dal suo genere che categorizza lrsquoentitagrave al fine dipoter effettuare query e una chiave che la identifica in modo univoco allrsquointerno delsuo genere

In Art Everywhere abbiamo utilizzato Python NDB Datastore API per po-ter definire modelli allrsquointerno di unrsquoapplicazione App Engine Un modello egrave unaclasse Python che agisce come una sorta di schema di database descrive un tipo didati in termini di proprietagrave

Nel capitolo 3 verragrave approfondita lrsquoanalisi concettuale del progetto che porteragrave alladefinizione del modello della base di dati utilizzata

214 Picasa Web Albums Data API

Le API di Picasa Web Albums consentono a siti web e applicazioni mobili di integrarsicon Picasa un software grafico per organizzare e modificare fotografie digitali evideo e di condividerle con altri utenti nei ldquoweb albumrdquoArt Everywhere memorizza tutte le immagini caricate dagli utenti su Picasa WebAlbums Usando lrsquoaccount Google dellrsquoapplicazione tutte le immagini (inviate daldispositivo mobile) vengono memorizzate dal backend in un web album chiamatoldquoArt Everywhererdquo e accessibile a chiunque tramite URL Tali URL vengono memo-rizzate nel database come una proprietagrave (url) della entitagrave PictureEntryDa App Engine lrsquoupload delle immagini su Picasa Web Album viene effettuatousando la libreria Google Data Python

215 Android

Android4 egrave un sistema operativo per dispositivi mobili sviluppato da Google Incbasato su kernel Linux e distribuito sotto i termini della licenza Apache 20 checonsente di modificare e distribuire liberamente il codice sorgentePer lo sviluppo di Art Everywhere egrave stato utilizzato Android Studio lrsquoIDE ufficialeper lo sviluppo di applicazioni Android basato su IntelliJ Idea e si egrave scelto di renderedisponibile lrsquoapplicazione a partire dalla versione sdk 15+ ovvero compatibile apartire dalla versione Android 40 (Ice Cream Sandwich)

216 Python

Python5 egrave un linguaggio di programmazione orientato agli oggetti e utilizzabile permolti tipi di sviluppo software Ersquo stato utilizzato per la realizzazione del backenddi Art Everyhwere sottoforma di una Python web app che interagisce con il web

4httpsitwikipediaorgwikiAndroid5httpswwwpythonorg

21 Tecnologie in uso 6

server GAE usando il protocollo WSGI6 In particolare egrave stato utilizzato webapp2un framework WSGI compatibile che consente di creare rapidamente sempliciapplicazioni web per il runtime di Python 27 Infatti la Python web app vieneeseguita da GAE utilizzando il linguaggio pre-caricato Python in un ambiente sicurosandbox Si tratta di un ambiente Python puro lrsquointerprete Python puograve eseguirequalsiasi codice Python ma non puograve caricare moduli Python che contengono codiceC

Inoltre in Art Everywhere il linguaggio di programmazione Python egrave statoutilizzato per codificare lrsquoalgoritmo di pattern recognition utilizzando la libreriaOpenCV (2110) il framework web Flask (218) e caricando il codice sul servizio dihosting PythonAnywhere (219)

217 OAuth 20

OAuth 20 egrave un protocollo aperto che garantisce ai service provider lrsquoaccesso daparte di terzi ai dati degli utenti proteggendo contemporanemente le loro credenzialiErsquo utilizzato dalle API di Google (ad esempio effettuare il login usando lrsquoaccountGoogle) per lrsquoautenticazione e le autorizzazioni e tutte le applicazioni seguono unpattern quando si accede ad un API di Google usando OAuth 20

bull ottenere le credenziali dalla Google Developer Console7 cioegrave il clientID e client secret che sono noti solamente a Google e alla propria applicazione

bull ottenere un token di accesso dal Server delle Autorizzazioni di Goo-gle prima che lrsquoapplicazione possa accedere ai dati privati tramite un API diGoogle si deve ottenere un token di accesso che concede lrsquoaccesso a tale APIUn parametro variabile di nome scope controlla lrsquoinsieme di risorse e delle ope-razioni che un token di accesso permette Se lrsquoutente concede lrsquoautorizzazioneil Server delle Autorizzazioni Google invia allrsquoapplicazione un token di accessoSe lrsquoutente non concede lrsquoautorizzazione il server restituisce un errore

bull inviare token di accesso ad uno specifico API in un header HTTP diautorizzazione

bull aggiornare il token di accesso se necessario poichegrave hanno una duratalimitata

218 Flask

Flask8 egrave un framework web scritto in Python e basato sullo strumento Werkzeug(libreria di utilitagrave HTTP e WSGI per Python) e con il motore template Jinja2 Flaskviene chiamato microframework percheacute non forza uno sviluppatore ad utilizzare un

6httpsitwikipediaorgwikiWeb_Server_Gateway_Interface Il Web Server Gateway In-terface (WSGI) egrave un protocollo di trasmissione che stabilisce e descrive comunicazioni ed interazionitra server ed applicazioni web scritte nel linguaggio Python Egrave quindi lrsquointerfaccia standard del webservice per la programmazione in Python

7httpsconsoledevelopersgooglecom8httpflaskpocooorgdocs010

22 Tecnologie abbandonate 7

particolare strumento o una libreria Non ha alcun livello di astrazione del databasela validazione dei form o qualsiasi altro componente in cui librerie di terze partipre-esistenti forniscono funzioni comuniIn Art Everywhere Flask egrave stato usato per realizzare unrsquoapplicazione web contenentelrsquoalgoritmo di pattern recognition per la similaritagrave tra immagini (53) e permetterecosigrave richieste RESTful effettuate dal backend

219 PythonAnywhere

PythonAnywhere9 egrave un servizio di hosting Web basato sul linguaggio di program-mazione Python Le applicazioni web ospitate possono essere scritte utilizzandoqualsiasi applicazione basata su framework WSGI con Art Everywhere abbiamoutilizzato Flask

2110 OpenCV

OpenCV10 egrave una libreria open source per software di computer vision e machinelearning OpenCV egrave stato realizzato per fornire una infrastruttura comune perapplicazioni di computer vision La libreria dispone metodi che possono essereutilizzati per rilevare e riconoscere i volti umani identificare oggetti classificare leazioni umane nei video tracciare movimenti di macchine su pista estrarre modelli3D di oggetti seguire i movimenti degli occhi riconoscere scenari eccDispone di interfacce C++ C Python Java e MATLAB e supporta WindowsLinux Android e Mac OS

In Art Everywhere tale libreria egrave stata utilizzata per realizzare lrsquoalgoritmodi pattern recognition per la similaritagrave tra immagini (53) utilizzando lrsquointerfacciaPython in ambiente Linux

22 Tecnologie abbandonate

221 Google BlobStore API

BlobStore API11 consente alle applicazioni di servire oggetti di dati chiamati blobche sono molto piugrave grandi della dimensione consentita per oggetti nel servizioDatastore come ad esempio i file video o immagini Blobs sono creati caricandoun file tramite una richiesta HTTP e cosigrave Blobstore crea un blob dal contenuto delfile e restituisce un riferimento per il blob chiamato blob key che potragrave poi essereutilizzato per servire il blobQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Per poter scrivere un blob direttamente sul Datastore egrave necessario lrsquoutilizzodi una low-level API messa a disposizione da Google Files API Essa perograve

9httpswwwpythonanywherecom10httpopencvorg11httpscloudgooglecomappenginedocsjavablobstore

23 Metodologia utilizzata ed organizzazione del lavoro 8

egrave stata deprecata da Google12 in favore dellrsquoutilizzo del solo Google CloudStorage il quale offre un servizio di scrittura file-like similare

bull Google Cloud Datastore offre uno spazio di archiviazione limitato per lrsquoarchi-viazione dei blobs (5GB di spazio free) che si sarebbe saturato facilmente seavessimo scelto di caricare le immagini direttamente su di esso

222 Google Cloud Storage

Google Cloud Storage13 egrave un servizio Internet per memorizzare i dati nel cloud diGoogleQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Spazio di archiviazione free inferiore rispetto a quello offerto da Picasa (5GBdi spazio offerti da GCS contro i 15GB di spazio gratuito offerti da GoogleDrive e di conseguenza messi a disposizione per Picasa)

bull Maggiore efficienza nellrsquoupload riscontrata nei test effettuati

23 Metodologia utilizzata ed organizzazione del lavoro

231 Milestones

Il workshop Google Technologies for Cloud and Web Development nel quale egrave statorealizzato il progetto Art Everywhere ha previsto delle milestones intermedieovvero dei momenti di verifica del progetto nei quali egrave stato presentato lo stato diavanzamento del lavoro ed egrave stato valutato dallo staff e dai mentors del workshop

Per la prima milestone (Gennaio 2015) ci siamo concentrati sullo studiodelle tecnologie utilizzate per sviluppare un Minimum Viable Product con lo scopodi presentare e testare le principali caratteristiche dellrsquoapplicazione In particolareabbiamo sviluppato lrsquoUpload delle immagini e la Galleria principale usata permostrare le opere caricate dagli artisti

Per la seconda milestone (Febbraio 2015) ci siamo focalizzati sui feedbackricevuti nella precedente e sui bisogni dei nostri utenti (gli artisti) sottoponendo unsondaggio a piugrave di 50 artisti Sono state aggiunte altre caratteristiche come la Paginadellrsquoartista il Dettaglio opera e i Filtri di ricerca opere La Release Candidate egravestata testata da 10 utenti I risultati dei sondaggi sono stati presentati nel Capitolo 6

Lo scopo della terza milestone (Marzo 2015) era quello di presentare lrsquointe-ro progetto funzionante Lrsquoapplicazione egrave stata completata realizzando la partesocial (Likes Commenti e Condivisione) migliorando lrsquoUser Interface adottando ilMaterial Design e lrsquousabilitagrave dellrsquoapplicazione attraverso dei sondaggi condotti suun campione di utenti

12httpscloudgooglecomappenginedocspythongooglestorage13httpscloudgooglecomstoragedocsoverview

23 Metodologia utilizzata ed organizzazione del lavoro 9

La quarta milestone (Aprile 2015) rappresentava la Final Submission ovve-ro la presentazione del progetto davanti ad una giuria composta oltre che dallostaff del workshop da ingegneri Google Allrsquoapplicazione sono state aggiunte lapossibilitagrave di modificareeliminare unrsquoopera drsquoarte modificareaggiornare il profilodellrsquoartista segnalare un commento o unrsquoopera offensiva e visualizzare la lista dellepersone che hanno messo un Like ad unrsquoopera

232 Divisione del lavoro

Il progetto egrave stato realizzato come lavoro di gruppo durante il workshop GoogleTechnologies for Cloud and Web Development e la suddivisione del lavoro egrave derivatadallrsquoarchitettura three-tier usata come riferimento ovvero interfaccia utente logicafunzionale (business logic) e gestione dei dati persistenti Ciascuno ha poi svi-luppato una o piugrave funzionalitagrave che ha approfondito nella propria relazione al progetto

Il mio personale contributo che viene presentato in queste pagine ha ri-guardato gli algoritmi usati per il trasferimento (uploaddownload) efficiente delleopere drsquoarte ovvero di immagini e per la loro compressione prevenendo unaperdita significativa della qualitagrave Inoltre viene presentato il sistema realizzatoper il riconoscimento di pattern finalizzato ad individuare similaritagrave tra le operedrsquoarte presenti nel database e con opere drsquoarte famose in modo da individuare falsidrsquoautore e prevenire eventuali furti di proprietagrave intellettuale

233 Tool utilizzati

Per coordinare il lavoro abbiamo utilizzato GitHub14 un servizio web di hosting perlo sviluppo di progetti software che ci ha permesso di creare una repository15 perpoter condividere il codice del progetto e lavorare cosigrave simultaneamente Inoltreabbiamo ritenuto molto utile la funzione Issues che rappresenta un ottimo modoper tenere traccia delle attivitagrave miglioramenti e bug del progetto

Abbiamo effettuato revisioni continue circa ogni 23 giorni con lo scopo diverificare lrsquoavanzamento del lavoro in base alle milestones fissate Ciograve egrave avvenutotramite incontri fisici o tramite il servizio di messaggistica istantanea e VoIPHangout16 Google Drive17 egrave stato utilizzato per lrsquoarchiviazione e lo scambio didocumenti condivisi come ad esempio immagini documentazioni diagrammidellrsquoarchitettura e di progettazioneecc Survio18 egrave un software online per crearegratuitamente questionari e sondaggi ed egrave cosigrave stato utilizzato per sottoporre iquestionari presentati nel Capitolo 6 Infine abbiamo utilizzato Android Studio19lrsquoIDE ufficiale per lo sviluppo di applicazioni Android e PyCharm20un ambiente disviluppo per la programmazione Python

14httpsgithubcom15httpsgithubcomdavideaurucciArtEverywhere16httpwwwgooglecom+learnmorehangouts17httpdrivegooglecom18httpwwwsurviocomit19httpsdeveloperandroidcomsdkindexhtml20httpswwwjetbrainscompycharm

10

Capitolo 3

Analisi concettuale del sistema

In questo capitolo viene approfondita la conoscenza del dominio di interesse inmaniera tale da poter descrivere in modo preciso e completo cosa tale progettodeve realizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

31 Modello Entitagrave-Relazioni

LikeEntry

PictureEntryArtistEntry

FlagEntry

TechniqueEntry

CommentEntry

BlacklistEntry

CommentFlag PictureFlag FlaggedPicture

FlaggedComment

PictureParent

CommentBy CommentParent

PictureTechnique

Figura 31 Schema ER dellrsquoapplicazione

311 Vincoli non esprimibili nello schema

Non sono esprimibili nello schema i seguenti vincoli esterni

bull Vincolo sul numero segnalazioni di Visitor forall v isin Istanze(IVisitor)esiste al piugrave un fd isin Istanze(IFlagged) con fd = ltUserv FlagEntryfgt

bull Vincolo sullrsquoattributo likes forall p isin Istanze(IPictureEntry) sia I = ltPictu-reEntryp ArtistEntry agt isin Istanze(ILikeEntry) | a isin Istanze(IArtistEntry)

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

vii

usato da WhatsappInoltre viene presentato il sistema realizzato per il riconoscimento di patternfinalizzato ad individuare similaritagrave tra le opere drsquoarte presenti nel database e conopere drsquoarte famose in modo da individuare falsi drsquoautore e prevenire eventualifurti di proprietagrave intellettuale

Struttura della tesiPer concludere la parte introduttiva diamo per ogni capitolo una breve sintesi

Capitolo 1 Viene presentata una descrizione completa e dettagliata della realtagrave diinteresse che mette in evidenza quali sono i dati che il sistema deve gestiree quali sono le principali funzionalitagrave includendo per alcune di esse unoscreenshot

Capitolo 2 Vengono mostrate le tecnologie adottate nel progetto soffermandosiin particolare su quelle innovative (ovvero non presentate nei corsi universi-tari) e su quelle in uso e specificando le motivazioni che ci hanno spinto adabbandonarne alcune Inoltre viene presentata la metodologia utilizzata nellaconduzione del progetto

Capitolo 3 Viene approfondita la conoscenza del dominio di interesse in manieratale da poter descrivere in modo preciso e completo cosa questo progetto deverealizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

Capitolo 4 Si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedelepossibile allo schema ER di partenza e che sia al tempo stesso efficiente

Capitolo 5 Viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inoltre ci si sofferma maggiormentesullo sviluppo degli algoritmi usati per il trasferimento efficiente e per lacompressione di immagini prevenendo una significativa perdita di qualitagraveInfine viene presentato il sistema realizzato per il riconoscimento di patterntra opere drsquoarte finalizzato ad individuare similaritagrave tra opere drsquoarte

Capitolo 6 Vengono date indicazioni su come installare lrsquoapplicazione e si descrivecome egrave stata effettuata la validazione e la fase di test dellrsquoapplicazione

1

Capitolo 1

Requisiti

In questo capitolo viene effettuata la raccolta e lrsquoanalisi dei requisti procedendoquindi alla definizione delle proprietagrave e delle funzionalitagrave del sistema Viene prodottauna descrizione completa e dettagliata dei dati che il sistema deve gestire e delleoperazioni da effettuare su di essi Infine vengono illustrati alcuni screenshots delleprincipali funzionalitagrave del sistema

11 Specifica dei requisitiSi vuole progettare lo schema concettuale corrispondente allrsquoapplicazione nella qualeinteressa memorizzare lrsquoemail di ogni utente Ogni utente puograve essere un visitatore(ed in tal caso non interessa memorizzare alcuna proprietagrave aggiuntiva) o un artistaper il quale si vuole memorizzare il nome il cognome unrsquoimmagine di profilo edeventualmente un nickname il suo sito la sua biografia e lrsquoeventuale id dellrsquoimmaginedi profilo (in caso essa venga sostituita) Egrave di interesse per lrsquoapplicazione memorizzareinformazioni sulle opere drsquoarte caricate dagli artisti Nello specifico interessano lrsquourldella immagine il suo identificativo di caricamento la data e ora di caricamentoil titolo ed eventualmente una descrizione il luogo in cui egrave stata realizzata e lesue dimensioni Si vuole anche memorizzare lrsquoemail dellrsquoartista che ha caricatolrsquoopera Si vogliono anche memorizzare le tecniche pittoriche delle quali interessamemorizzare il nome (univoco) e che sono identificate per mezzo di una chiavenumerica Ogni opera drsquoarte caricata deve necessariamente specificare il tipo ditecnica pittorica utilizzata Le opere drsquoarte possono ricevere apprezzamenti e critichesotto forma di likes e commenti Di ogni like memorizzato interessa sapere chi egravelrsquoartista che lo ha apposto lrsquoopera drsquoarte coinvolta e la data e ora in cui esso egravestato apposto Per ogni opera drsquoarte egrave di interesse memorizzare anche il numerodi like Ogni commento egrave identificato da un codice numerico e di esso interessa iltesto del commento la data e ora in cui esso egrave stato apposto lrsquoutente che lo haapposto e lrsquoopera drsquoarte coinvolta Opere drsquoarte e commenti possono essere giudicatidagli artisti registrati come inappropriati A tale scopo egrave possibile segnalare uncommento o unrsquoopera drsquoarte e della segnalazione interessa sapere qual egrave il contenutocoinvolto lrsquoartista segnalante e lrsquoutente segnalato Ogni artista puograve segnalare uncerto contenuto unrsquounica volta Inoltre si vuole tenere traccia degli utenti che acausa delle segnalazioni ricevute sono finiti sulla ldquolista nerardquo dellrsquoapplicazione e

12 Screenshots delle principali funzionalitagrave 2

che non possono piugrave utilizzarla Di una entry della lista nera interessa sapere chi egravelrsquoutente coinvolto In particolare un utente visitatore finisce in lista nera alla primasegnalazione ricevuta mentre un utente artista finisce in lista nera solo dopo cheavendo valutato le segnalazioni ricevute si ritiene che esso debba essere inserito inessa A tale scopo per lrsquoartista si memorizza una proprietagrave aggiuntiva che tieneconto della gravitagrave dello storico delle segnalazioni precedenti

12 Screenshots delle principali funzionalitagrave

Figura 11 Galleria principale Figura 12 Profilo Artista

Figura 13 Dettaglio Opera Figura 14 Commenti

3

Capitolo 2

Tecnologie e metodologie usate

In questo capitolo verranno presentate le principali tecnologie utilizzate specificandole funzionalitagrave delle tecnologie attualmente in uso e le motivazioni che ci hannospinto ad abbandonare alcune tecnologie In seguito verragrave presentata la metodologiautilizzata nella conduzione del progetto durante il periodo del workshop Google e larelativa organizzazione del lavoro tra i componenti del gruppo

21 Tecnologie in uso

211 Google App Engine

Google App Engine1 (GAE) egrave una Platform as a Service (PaaS) che consente dicreare ed eseguire applicazioni web sullrsquoinfrastruttura di Google GAE offre unascalabilitagrave automatica per le applicazioni a seconda del numero di richieste drsquousoper quella applicazione ed alloca in automatico piugrave risorse per gestire la doman-da addizionale Le applicazioni vengono eseguite in un ambiente sandbox sicuropermettendo la distribuzione delle richieste su piugrave server e la scalabilitagrave dei serverper soddisfare le richieste di traffico GAE supporta app scritte in una varietagrave dilinguaggi di programmazione come Java Python PHP e GoPer lo sviluppo di Art Everywhere si egrave scelto utilizzare il linguaggio di programma-zione Python e quindi di realizzare una Python web app che rappresenta il backenddellrsquoapplicazione

212 Google Cloud Endpoints

Google Cloud Endpoints2 (GCE) egrave un insieme di strumenti librerie e funzionalitagraveche consentono di generare API e librerie client da unrsquoapplicazione GAE (backend)per semplificare lrsquoaccesso client ai dati da altre applicazioni GCE utilizza la libreriaGoogle Protocol RPC un protocollo per lrsquoinvocazione remota di procedure HTTP-based Egrave possibile definire un servizio RPC in una singola classe Python che contieneun certo numero di metodi remoti dichiarati Ogni metodo remoto accetta un insiemespecifico di parametri come richiesta e restituisce una risposta specifica Questiparametri di richiesta e di risposta sono le classi definite dallrsquoutente note come

1httpscloudgooglecomappengine2httpscloudgooglecomappenginedocsjavaendpoints

21 Tecnologie in uso 4

Tabella 21 Parametri accettati da un metodo remoto

Request Message Class La classe del messaggio di richiesta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Response Message Class La classe del messaggio di risposta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Name Nome alternativo al metodoPath Il percorso URI da usare per accedere al

metodoHttp method Il metodo HTTP da usare (GET POST

ecc)

messaggi (ProtoRPC Messages) La Tabella 21 mostra i parametri accettati daimetodi remotiDopo aver completato la creazione dei vari metodi egrave possibile auto-generare lelibrerie per il client e quindi da importare nellrsquoapplicazione mobile Nel caso diArt Everywhere le librerie sono scritte in Java dato che si egrave scelto di realizzareunrsquoapplicazione Android Per autogenerare le librerie per il client egrave necessario usareil seguente comando da linea di comando

google_appengineendpointscfgpy ltcommandgt lttarget_langgt ltoptionsgt[class-name]

bull ltcommandgt puograve essere get_client_lib o get_discovery_doc

bull lttarget_langgt (usato solo con get_client_lib) specifica il tipo di pacchettoche si desidera creare Si egrave tenuti ad inserire il valore java per i client Javacome Android

bull ltoptiongt se fornito indica una o piugrave opzioni disponibili Ad esempio build-system specifica il tipo di bundle da produrre Si egrave tenuti a specificare gradleper i client Android

bull [class name] egrave il nome completo della classe

213 Google Cloud Datastore

Google Cloud Datastore3 (GCD) fornisce lrsquoarchiviazione dei dati senza richiedereuno schema fisso (NoSQL) garantendo una memorizzazione robusta e scalabile perle applicazioniA differenza dei tradizionali database relazionali GCD utilizza unrsquoarchitetturadistribuita per gestire automaticamente la scalabilitagrave fino a grandi insiemi di datiPoicheacute tutte le query sono servite da indici predefiniti i tipi di query che possonoessere eseguite sono piugrave restrittive rispetto a quelle consentite su un databaserelazionale con SQL In particolare non sono supportate le seguenti operazioni

3httpscloudgooglecomdatastoredocsconceptsoverview

21 Tecnologie in uso 5

join disuguaglianza di filtraggio su piugrave proprietagrave filtraggio dei dati sulla base deirisultati di una subqueryGCD salva gli oggetti di dati come entitagrave Unrsquoentitagrave ha una o piugrave proprietagrave icui valori possono essere uno dei diversi tipi di dati supportati per esempio unaproprietagrave puograve essere una stringa un numero intero o un riferimento ad unrsquoaltraentitagrave Ogni entitagrave egrave identificato dal suo genere che categorizza lrsquoentitagrave al fine dipoter effettuare query e una chiave che la identifica in modo univoco allrsquointerno delsuo genere

In Art Everywhere abbiamo utilizzato Python NDB Datastore API per po-ter definire modelli allrsquointerno di unrsquoapplicazione App Engine Un modello egrave unaclasse Python che agisce come una sorta di schema di database descrive un tipo didati in termini di proprietagrave

Nel capitolo 3 verragrave approfondita lrsquoanalisi concettuale del progetto che porteragrave alladefinizione del modello della base di dati utilizzata

214 Picasa Web Albums Data API

Le API di Picasa Web Albums consentono a siti web e applicazioni mobili di integrarsicon Picasa un software grafico per organizzare e modificare fotografie digitali evideo e di condividerle con altri utenti nei ldquoweb albumrdquoArt Everywhere memorizza tutte le immagini caricate dagli utenti su Picasa WebAlbums Usando lrsquoaccount Google dellrsquoapplicazione tutte le immagini (inviate daldispositivo mobile) vengono memorizzate dal backend in un web album chiamatoldquoArt Everywhererdquo e accessibile a chiunque tramite URL Tali URL vengono memo-rizzate nel database come una proprietagrave (url) della entitagrave PictureEntryDa App Engine lrsquoupload delle immagini su Picasa Web Album viene effettuatousando la libreria Google Data Python

215 Android

Android4 egrave un sistema operativo per dispositivi mobili sviluppato da Google Incbasato su kernel Linux e distribuito sotto i termini della licenza Apache 20 checonsente di modificare e distribuire liberamente il codice sorgentePer lo sviluppo di Art Everywhere egrave stato utilizzato Android Studio lrsquoIDE ufficialeper lo sviluppo di applicazioni Android basato su IntelliJ Idea e si egrave scelto di renderedisponibile lrsquoapplicazione a partire dalla versione sdk 15+ ovvero compatibile apartire dalla versione Android 40 (Ice Cream Sandwich)

216 Python

Python5 egrave un linguaggio di programmazione orientato agli oggetti e utilizzabile permolti tipi di sviluppo software Ersquo stato utilizzato per la realizzazione del backenddi Art Everyhwere sottoforma di una Python web app che interagisce con il web

4httpsitwikipediaorgwikiAndroid5httpswwwpythonorg

21 Tecnologie in uso 6

server GAE usando il protocollo WSGI6 In particolare egrave stato utilizzato webapp2un framework WSGI compatibile che consente di creare rapidamente sempliciapplicazioni web per il runtime di Python 27 Infatti la Python web app vieneeseguita da GAE utilizzando il linguaggio pre-caricato Python in un ambiente sicurosandbox Si tratta di un ambiente Python puro lrsquointerprete Python puograve eseguirequalsiasi codice Python ma non puograve caricare moduli Python che contengono codiceC

Inoltre in Art Everywhere il linguaggio di programmazione Python egrave statoutilizzato per codificare lrsquoalgoritmo di pattern recognition utilizzando la libreriaOpenCV (2110) il framework web Flask (218) e caricando il codice sul servizio dihosting PythonAnywhere (219)

217 OAuth 20

OAuth 20 egrave un protocollo aperto che garantisce ai service provider lrsquoaccesso daparte di terzi ai dati degli utenti proteggendo contemporanemente le loro credenzialiErsquo utilizzato dalle API di Google (ad esempio effettuare il login usando lrsquoaccountGoogle) per lrsquoautenticazione e le autorizzazioni e tutte le applicazioni seguono unpattern quando si accede ad un API di Google usando OAuth 20

bull ottenere le credenziali dalla Google Developer Console7 cioegrave il clientID e client secret che sono noti solamente a Google e alla propria applicazione

bull ottenere un token di accesso dal Server delle Autorizzazioni di Goo-gle prima che lrsquoapplicazione possa accedere ai dati privati tramite un API diGoogle si deve ottenere un token di accesso che concede lrsquoaccesso a tale APIUn parametro variabile di nome scope controlla lrsquoinsieme di risorse e delle ope-razioni che un token di accesso permette Se lrsquoutente concede lrsquoautorizzazioneil Server delle Autorizzazioni Google invia allrsquoapplicazione un token di accessoSe lrsquoutente non concede lrsquoautorizzazione il server restituisce un errore

bull inviare token di accesso ad uno specifico API in un header HTTP diautorizzazione

bull aggiornare il token di accesso se necessario poichegrave hanno una duratalimitata

218 Flask

Flask8 egrave un framework web scritto in Python e basato sullo strumento Werkzeug(libreria di utilitagrave HTTP e WSGI per Python) e con il motore template Jinja2 Flaskviene chiamato microframework percheacute non forza uno sviluppatore ad utilizzare un

6httpsitwikipediaorgwikiWeb_Server_Gateway_Interface Il Web Server Gateway In-terface (WSGI) egrave un protocollo di trasmissione che stabilisce e descrive comunicazioni ed interazionitra server ed applicazioni web scritte nel linguaggio Python Egrave quindi lrsquointerfaccia standard del webservice per la programmazione in Python

7httpsconsoledevelopersgooglecom8httpflaskpocooorgdocs010

22 Tecnologie abbandonate 7

particolare strumento o una libreria Non ha alcun livello di astrazione del databasela validazione dei form o qualsiasi altro componente in cui librerie di terze partipre-esistenti forniscono funzioni comuniIn Art Everywhere Flask egrave stato usato per realizzare unrsquoapplicazione web contenentelrsquoalgoritmo di pattern recognition per la similaritagrave tra immagini (53) e permetterecosigrave richieste RESTful effettuate dal backend

219 PythonAnywhere

PythonAnywhere9 egrave un servizio di hosting Web basato sul linguaggio di program-mazione Python Le applicazioni web ospitate possono essere scritte utilizzandoqualsiasi applicazione basata su framework WSGI con Art Everywhere abbiamoutilizzato Flask

2110 OpenCV

OpenCV10 egrave una libreria open source per software di computer vision e machinelearning OpenCV egrave stato realizzato per fornire una infrastruttura comune perapplicazioni di computer vision La libreria dispone metodi che possono essereutilizzati per rilevare e riconoscere i volti umani identificare oggetti classificare leazioni umane nei video tracciare movimenti di macchine su pista estrarre modelli3D di oggetti seguire i movimenti degli occhi riconoscere scenari eccDispone di interfacce C++ C Python Java e MATLAB e supporta WindowsLinux Android e Mac OS

In Art Everywhere tale libreria egrave stata utilizzata per realizzare lrsquoalgoritmodi pattern recognition per la similaritagrave tra immagini (53) utilizzando lrsquointerfacciaPython in ambiente Linux

22 Tecnologie abbandonate

221 Google BlobStore API

BlobStore API11 consente alle applicazioni di servire oggetti di dati chiamati blobche sono molto piugrave grandi della dimensione consentita per oggetti nel servizioDatastore come ad esempio i file video o immagini Blobs sono creati caricandoun file tramite una richiesta HTTP e cosigrave Blobstore crea un blob dal contenuto delfile e restituisce un riferimento per il blob chiamato blob key che potragrave poi essereutilizzato per servire il blobQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Per poter scrivere un blob direttamente sul Datastore egrave necessario lrsquoutilizzodi una low-level API messa a disposizione da Google Files API Essa perograve

9httpswwwpythonanywherecom10httpopencvorg11httpscloudgooglecomappenginedocsjavablobstore

23 Metodologia utilizzata ed organizzazione del lavoro 8

egrave stata deprecata da Google12 in favore dellrsquoutilizzo del solo Google CloudStorage il quale offre un servizio di scrittura file-like similare

bull Google Cloud Datastore offre uno spazio di archiviazione limitato per lrsquoarchi-viazione dei blobs (5GB di spazio free) che si sarebbe saturato facilmente seavessimo scelto di caricare le immagini direttamente su di esso

222 Google Cloud Storage

Google Cloud Storage13 egrave un servizio Internet per memorizzare i dati nel cloud diGoogleQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Spazio di archiviazione free inferiore rispetto a quello offerto da Picasa (5GBdi spazio offerti da GCS contro i 15GB di spazio gratuito offerti da GoogleDrive e di conseguenza messi a disposizione per Picasa)

bull Maggiore efficienza nellrsquoupload riscontrata nei test effettuati

23 Metodologia utilizzata ed organizzazione del lavoro

231 Milestones

Il workshop Google Technologies for Cloud and Web Development nel quale egrave statorealizzato il progetto Art Everywhere ha previsto delle milestones intermedieovvero dei momenti di verifica del progetto nei quali egrave stato presentato lo stato diavanzamento del lavoro ed egrave stato valutato dallo staff e dai mentors del workshop

Per la prima milestone (Gennaio 2015) ci siamo concentrati sullo studiodelle tecnologie utilizzate per sviluppare un Minimum Viable Product con lo scopodi presentare e testare le principali caratteristiche dellrsquoapplicazione In particolareabbiamo sviluppato lrsquoUpload delle immagini e la Galleria principale usata permostrare le opere caricate dagli artisti

Per la seconda milestone (Febbraio 2015) ci siamo focalizzati sui feedbackricevuti nella precedente e sui bisogni dei nostri utenti (gli artisti) sottoponendo unsondaggio a piugrave di 50 artisti Sono state aggiunte altre caratteristiche come la Paginadellrsquoartista il Dettaglio opera e i Filtri di ricerca opere La Release Candidate egravestata testata da 10 utenti I risultati dei sondaggi sono stati presentati nel Capitolo 6

Lo scopo della terza milestone (Marzo 2015) era quello di presentare lrsquointe-ro progetto funzionante Lrsquoapplicazione egrave stata completata realizzando la partesocial (Likes Commenti e Condivisione) migliorando lrsquoUser Interface adottando ilMaterial Design e lrsquousabilitagrave dellrsquoapplicazione attraverso dei sondaggi condotti suun campione di utenti

12httpscloudgooglecomappenginedocspythongooglestorage13httpscloudgooglecomstoragedocsoverview

23 Metodologia utilizzata ed organizzazione del lavoro 9

La quarta milestone (Aprile 2015) rappresentava la Final Submission ovve-ro la presentazione del progetto davanti ad una giuria composta oltre che dallostaff del workshop da ingegneri Google Allrsquoapplicazione sono state aggiunte lapossibilitagrave di modificareeliminare unrsquoopera drsquoarte modificareaggiornare il profilodellrsquoartista segnalare un commento o unrsquoopera offensiva e visualizzare la lista dellepersone che hanno messo un Like ad unrsquoopera

232 Divisione del lavoro

Il progetto egrave stato realizzato come lavoro di gruppo durante il workshop GoogleTechnologies for Cloud and Web Development e la suddivisione del lavoro egrave derivatadallrsquoarchitettura three-tier usata come riferimento ovvero interfaccia utente logicafunzionale (business logic) e gestione dei dati persistenti Ciascuno ha poi svi-luppato una o piugrave funzionalitagrave che ha approfondito nella propria relazione al progetto

Il mio personale contributo che viene presentato in queste pagine ha ri-guardato gli algoritmi usati per il trasferimento (uploaddownload) efficiente delleopere drsquoarte ovvero di immagini e per la loro compressione prevenendo unaperdita significativa della qualitagrave Inoltre viene presentato il sistema realizzatoper il riconoscimento di pattern finalizzato ad individuare similaritagrave tra le operedrsquoarte presenti nel database e con opere drsquoarte famose in modo da individuare falsidrsquoautore e prevenire eventuali furti di proprietagrave intellettuale

233 Tool utilizzati

Per coordinare il lavoro abbiamo utilizzato GitHub14 un servizio web di hosting perlo sviluppo di progetti software che ci ha permesso di creare una repository15 perpoter condividere il codice del progetto e lavorare cosigrave simultaneamente Inoltreabbiamo ritenuto molto utile la funzione Issues che rappresenta un ottimo modoper tenere traccia delle attivitagrave miglioramenti e bug del progetto

Abbiamo effettuato revisioni continue circa ogni 23 giorni con lo scopo diverificare lrsquoavanzamento del lavoro in base alle milestones fissate Ciograve egrave avvenutotramite incontri fisici o tramite il servizio di messaggistica istantanea e VoIPHangout16 Google Drive17 egrave stato utilizzato per lrsquoarchiviazione e lo scambio didocumenti condivisi come ad esempio immagini documentazioni diagrammidellrsquoarchitettura e di progettazioneecc Survio18 egrave un software online per crearegratuitamente questionari e sondaggi ed egrave cosigrave stato utilizzato per sottoporre iquestionari presentati nel Capitolo 6 Infine abbiamo utilizzato Android Studio19lrsquoIDE ufficiale per lo sviluppo di applicazioni Android e PyCharm20un ambiente disviluppo per la programmazione Python

14httpsgithubcom15httpsgithubcomdavideaurucciArtEverywhere16httpwwwgooglecom+learnmorehangouts17httpdrivegooglecom18httpwwwsurviocomit19httpsdeveloperandroidcomsdkindexhtml20httpswwwjetbrainscompycharm

10

Capitolo 3

Analisi concettuale del sistema

In questo capitolo viene approfondita la conoscenza del dominio di interesse inmaniera tale da poter descrivere in modo preciso e completo cosa tale progettodeve realizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

31 Modello Entitagrave-Relazioni

LikeEntry

PictureEntryArtistEntry

FlagEntry

TechniqueEntry

CommentEntry

BlacklistEntry

CommentFlag PictureFlag FlaggedPicture

FlaggedComment

PictureParent

CommentBy CommentParent

PictureTechnique

Figura 31 Schema ER dellrsquoapplicazione

311 Vincoli non esprimibili nello schema

Non sono esprimibili nello schema i seguenti vincoli esterni

bull Vincolo sul numero segnalazioni di Visitor forall v isin Istanze(IVisitor)esiste al piugrave un fd isin Istanze(IFlagged) con fd = ltUserv FlagEntryfgt

bull Vincolo sullrsquoattributo likes forall p isin Istanze(IPictureEntry) sia I = ltPictu-reEntryp ArtistEntry agt isin Istanze(ILikeEntry) | a isin Istanze(IArtistEntry)

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

1

Capitolo 1

Requisiti

In questo capitolo viene effettuata la raccolta e lrsquoanalisi dei requisti procedendoquindi alla definizione delle proprietagrave e delle funzionalitagrave del sistema Viene prodottauna descrizione completa e dettagliata dei dati che il sistema deve gestire e delleoperazioni da effettuare su di essi Infine vengono illustrati alcuni screenshots delleprincipali funzionalitagrave del sistema

11 Specifica dei requisitiSi vuole progettare lo schema concettuale corrispondente allrsquoapplicazione nella qualeinteressa memorizzare lrsquoemail di ogni utente Ogni utente puograve essere un visitatore(ed in tal caso non interessa memorizzare alcuna proprietagrave aggiuntiva) o un artistaper il quale si vuole memorizzare il nome il cognome unrsquoimmagine di profilo edeventualmente un nickname il suo sito la sua biografia e lrsquoeventuale id dellrsquoimmaginedi profilo (in caso essa venga sostituita) Egrave di interesse per lrsquoapplicazione memorizzareinformazioni sulle opere drsquoarte caricate dagli artisti Nello specifico interessano lrsquourldella immagine il suo identificativo di caricamento la data e ora di caricamentoil titolo ed eventualmente una descrizione il luogo in cui egrave stata realizzata e lesue dimensioni Si vuole anche memorizzare lrsquoemail dellrsquoartista che ha caricatolrsquoopera Si vogliono anche memorizzare le tecniche pittoriche delle quali interessamemorizzare il nome (univoco) e che sono identificate per mezzo di una chiavenumerica Ogni opera drsquoarte caricata deve necessariamente specificare il tipo ditecnica pittorica utilizzata Le opere drsquoarte possono ricevere apprezzamenti e critichesotto forma di likes e commenti Di ogni like memorizzato interessa sapere chi egravelrsquoartista che lo ha apposto lrsquoopera drsquoarte coinvolta e la data e ora in cui esso egravestato apposto Per ogni opera drsquoarte egrave di interesse memorizzare anche il numerodi like Ogni commento egrave identificato da un codice numerico e di esso interessa iltesto del commento la data e ora in cui esso egrave stato apposto lrsquoutente che lo haapposto e lrsquoopera drsquoarte coinvolta Opere drsquoarte e commenti possono essere giudicatidagli artisti registrati come inappropriati A tale scopo egrave possibile segnalare uncommento o unrsquoopera drsquoarte e della segnalazione interessa sapere qual egrave il contenutocoinvolto lrsquoartista segnalante e lrsquoutente segnalato Ogni artista puograve segnalare uncerto contenuto unrsquounica volta Inoltre si vuole tenere traccia degli utenti che acausa delle segnalazioni ricevute sono finiti sulla ldquolista nerardquo dellrsquoapplicazione e

12 Screenshots delle principali funzionalitagrave 2

che non possono piugrave utilizzarla Di una entry della lista nera interessa sapere chi egravelrsquoutente coinvolto In particolare un utente visitatore finisce in lista nera alla primasegnalazione ricevuta mentre un utente artista finisce in lista nera solo dopo cheavendo valutato le segnalazioni ricevute si ritiene che esso debba essere inserito inessa A tale scopo per lrsquoartista si memorizza una proprietagrave aggiuntiva che tieneconto della gravitagrave dello storico delle segnalazioni precedenti

12 Screenshots delle principali funzionalitagrave

Figura 11 Galleria principale Figura 12 Profilo Artista

Figura 13 Dettaglio Opera Figura 14 Commenti

3

Capitolo 2

Tecnologie e metodologie usate

In questo capitolo verranno presentate le principali tecnologie utilizzate specificandole funzionalitagrave delle tecnologie attualmente in uso e le motivazioni che ci hannospinto ad abbandonare alcune tecnologie In seguito verragrave presentata la metodologiautilizzata nella conduzione del progetto durante il periodo del workshop Google e larelativa organizzazione del lavoro tra i componenti del gruppo

21 Tecnologie in uso

211 Google App Engine

Google App Engine1 (GAE) egrave una Platform as a Service (PaaS) che consente dicreare ed eseguire applicazioni web sullrsquoinfrastruttura di Google GAE offre unascalabilitagrave automatica per le applicazioni a seconda del numero di richieste drsquousoper quella applicazione ed alloca in automatico piugrave risorse per gestire la doman-da addizionale Le applicazioni vengono eseguite in un ambiente sandbox sicuropermettendo la distribuzione delle richieste su piugrave server e la scalabilitagrave dei serverper soddisfare le richieste di traffico GAE supporta app scritte in una varietagrave dilinguaggi di programmazione come Java Python PHP e GoPer lo sviluppo di Art Everywhere si egrave scelto utilizzare il linguaggio di programma-zione Python e quindi di realizzare una Python web app che rappresenta il backenddellrsquoapplicazione

212 Google Cloud Endpoints

Google Cloud Endpoints2 (GCE) egrave un insieme di strumenti librerie e funzionalitagraveche consentono di generare API e librerie client da unrsquoapplicazione GAE (backend)per semplificare lrsquoaccesso client ai dati da altre applicazioni GCE utilizza la libreriaGoogle Protocol RPC un protocollo per lrsquoinvocazione remota di procedure HTTP-based Egrave possibile definire un servizio RPC in una singola classe Python che contieneun certo numero di metodi remoti dichiarati Ogni metodo remoto accetta un insiemespecifico di parametri come richiesta e restituisce una risposta specifica Questiparametri di richiesta e di risposta sono le classi definite dallrsquoutente note come

1httpscloudgooglecomappengine2httpscloudgooglecomappenginedocsjavaendpoints

21 Tecnologie in uso 4

Tabella 21 Parametri accettati da un metodo remoto

Request Message Class La classe del messaggio di richiesta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Response Message Class La classe del messaggio di risposta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Name Nome alternativo al metodoPath Il percorso URI da usare per accedere al

metodoHttp method Il metodo HTTP da usare (GET POST

ecc)

messaggi (ProtoRPC Messages) La Tabella 21 mostra i parametri accettati daimetodi remotiDopo aver completato la creazione dei vari metodi egrave possibile auto-generare lelibrerie per il client e quindi da importare nellrsquoapplicazione mobile Nel caso diArt Everywhere le librerie sono scritte in Java dato che si egrave scelto di realizzareunrsquoapplicazione Android Per autogenerare le librerie per il client egrave necessario usareil seguente comando da linea di comando

google_appengineendpointscfgpy ltcommandgt lttarget_langgt ltoptionsgt[class-name]

bull ltcommandgt puograve essere get_client_lib o get_discovery_doc

bull lttarget_langgt (usato solo con get_client_lib) specifica il tipo di pacchettoche si desidera creare Si egrave tenuti ad inserire il valore java per i client Javacome Android

bull ltoptiongt se fornito indica una o piugrave opzioni disponibili Ad esempio build-system specifica il tipo di bundle da produrre Si egrave tenuti a specificare gradleper i client Android

bull [class name] egrave il nome completo della classe

213 Google Cloud Datastore

Google Cloud Datastore3 (GCD) fornisce lrsquoarchiviazione dei dati senza richiedereuno schema fisso (NoSQL) garantendo una memorizzazione robusta e scalabile perle applicazioniA differenza dei tradizionali database relazionali GCD utilizza unrsquoarchitetturadistribuita per gestire automaticamente la scalabilitagrave fino a grandi insiemi di datiPoicheacute tutte le query sono servite da indici predefiniti i tipi di query che possonoessere eseguite sono piugrave restrittive rispetto a quelle consentite su un databaserelazionale con SQL In particolare non sono supportate le seguenti operazioni

3httpscloudgooglecomdatastoredocsconceptsoverview

21 Tecnologie in uso 5

join disuguaglianza di filtraggio su piugrave proprietagrave filtraggio dei dati sulla base deirisultati di una subqueryGCD salva gli oggetti di dati come entitagrave Unrsquoentitagrave ha una o piugrave proprietagrave icui valori possono essere uno dei diversi tipi di dati supportati per esempio unaproprietagrave puograve essere una stringa un numero intero o un riferimento ad unrsquoaltraentitagrave Ogni entitagrave egrave identificato dal suo genere che categorizza lrsquoentitagrave al fine dipoter effettuare query e una chiave che la identifica in modo univoco allrsquointerno delsuo genere

In Art Everywhere abbiamo utilizzato Python NDB Datastore API per po-ter definire modelli allrsquointerno di unrsquoapplicazione App Engine Un modello egrave unaclasse Python che agisce come una sorta di schema di database descrive un tipo didati in termini di proprietagrave

Nel capitolo 3 verragrave approfondita lrsquoanalisi concettuale del progetto che porteragrave alladefinizione del modello della base di dati utilizzata

214 Picasa Web Albums Data API

Le API di Picasa Web Albums consentono a siti web e applicazioni mobili di integrarsicon Picasa un software grafico per organizzare e modificare fotografie digitali evideo e di condividerle con altri utenti nei ldquoweb albumrdquoArt Everywhere memorizza tutte le immagini caricate dagli utenti su Picasa WebAlbums Usando lrsquoaccount Google dellrsquoapplicazione tutte le immagini (inviate daldispositivo mobile) vengono memorizzate dal backend in un web album chiamatoldquoArt Everywhererdquo e accessibile a chiunque tramite URL Tali URL vengono memo-rizzate nel database come una proprietagrave (url) della entitagrave PictureEntryDa App Engine lrsquoupload delle immagini su Picasa Web Album viene effettuatousando la libreria Google Data Python

215 Android

Android4 egrave un sistema operativo per dispositivi mobili sviluppato da Google Incbasato su kernel Linux e distribuito sotto i termini della licenza Apache 20 checonsente di modificare e distribuire liberamente il codice sorgentePer lo sviluppo di Art Everywhere egrave stato utilizzato Android Studio lrsquoIDE ufficialeper lo sviluppo di applicazioni Android basato su IntelliJ Idea e si egrave scelto di renderedisponibile lrsquoapplicazione a partire dalla versione sdk 15+ ovvero compatibile apartire dalla versione Android 40 (Ice Cream Sandwich)

216 Python

Python5 egrave un linguaggio di programmazione orientato agli oggetti e utilizzabile permolti tipi di sviluppo software Ersquo stato utilizzato per la realizzazione del backenddi Art Everyhwere sottoforma di una Python web app che interagisce con il web

4httpsitwikipediaorgwikiAndroid5httpswwwpythonorg

21 Tecnologie in uso 6

server GAE usando il protocollo WSGI6 In particolare egrave stato utilizzato webapp2un framework WSGI compatibile che consente di creare rapidamente sempliciapplicazioni web per il runtime di Python 27 Infatti la Python web app vieneeseguita da GAE utilizzando il linguaggio pre-caricato Python in un ambiente sicurosandbox Si tratta di un ambiente Python puro lrsquointerprete Python puograve eseguirequalsiasi codice Python ma non puograve caricare moduli Python che contengono codiceC

Inoltre in Art Everywhere il linguaggio di programmazione Python egrave statoutilizzato per codificare lrsquoalgoritmo di pattern recognition utilizzando la libreriaOpenCV (2110) il framework web Flask (218) e caricando il codice sul servizio dihosting PythonAnywhere (219)

217 OAuth 20

OAuth 20 egrave un protocollo aperto che garantisce ai service provider lrsquoaccesso daparte di terzi ai dati degli utenti proteggendo contemporanemente le loro credenzialiErsquo utilizzato dalle API di Google (ad esempio effettuare il login usando lrsquoaccountGoogle) per lrsquoautenticazione e le autorizzazioni e tutte le applicazioni seguono unpattern quando si accede ad un API di Google usando OAuth 20

bull ottenere le credenziali dalla Google Developer Console7 cioegrave il clientID e client secret che sono noti solamente a Google e alla propria applicazione

bull ottenere un token di accesso dal Server delle Autorizzazioni di Goo-gle prima che lrsquoapplicazione possa accedere ai dati privati tramite un API diGoogle si deve ottenere un token di accesso che concede lrsquoaccesso a tale APIUn parametro variabile di nome scope controlla lrsquoinsieme di risorse e delle ope-razioni che un token di accesso permette Se lrsquoutente concede lrsquoautorizzazioneil Server delle Autorizzazioni Google invia allrsquoapplicazione un token di accessoSe lrsquoutente non concede lrsquoautorizzazione il server restituisce un errore

bull inviare token di accesso ad uno specifico API in un header HTTP diautorizzazione

bull aggiornare il token di accesso se necessario poichegrave hanno una duratalimitata

218 Flask

Flask8 egrave un framework web scritto in Python e basato sullo strumento Werkzeug(libreria di utilitagrave HTTP e WSGI per Python) e con il motore template Jinja2 Flaskviene chiamato microframework percheacute non forza uno sviluppatore ad utilizzare un

6httpsitwikipediaorgwikiWeb_Server_Gateway_Interface Il Web Server Gateway In-terface (WSGI) egrave un protocollo di trasmissione che stabilisce e descrive comunicazioni ed interazionitra server ed applicazioni web scritte nel linguaggio Python Egrave quindi lrsquointerfaccia standard del webservice per la programmazione in Python

7httpsconsoledevelopersgooglecom8httpflaskpocooorgdocs010

22 Tecnologie abbandonate 7

particolare strumento o una libreria Non ha alcun livello di astrazione del databasela validazione dei form o qualsiasi altro componente in cui librerie di terze partipre-esistenti forniscono funzioni comuniIn Art Everywhere Flask egrave stato usato per realizzare unrsquoapplicazione web contenentelrsquoalgoritmo di pattern recognition per la similaritagrave tra immagini (53) e permetterecosigrave richieste RESTful effettuate dal backend

219 PythonAnywhere

PythonAnywhere9 egrave un servizio di hosting Web basato sul linguaggio di program-mazione Python Le applicazioni web ospitate possono essere scritte utilizzandoqualsiasi applicazione basata su framework WSGI con Art Everywhere abbiamoutilizzato Flask

2110 OpenCV

OpenCV10 egrave una libreria open source per software di computer vision e machinelearning OpenCV egrave stato realizzato per fornire una infrastruttura comune perapplicazioni di computer vision La libreria dispone metodi che possono essereutilizzati per rilevare e riconoscere i volti umani identificare oggetti classificare leazioni umane nei video tracciare movimenti di macchine su pista estrarre modelli3D di oggetti seguire i movimenti degli occhi riconoscere scenari eccDispone di interfacce C++ C Python Java e MATLAB e supporta WindowsLinux Android e Mac OS

In Art Everywhere tale libreria egrave stata utilizzata per realizzare lrsquoalgoritmodi pattern recognition per la similaritagrave tra immagini (53) utilizzando lrsquointerfacciaPython in ambiente Linux

22 Tecnologie abbandonate

221 Google BlobStore API

BlobStore API11 consente alle applicazioni di servire oggetti di dati chiamati blobche sono molto piugrave grandi della dimensione consentita per oggetti nel servizioDatastore come ad esempio i file video o immagini Blobs sono creati caricandoun file tramite una richiesta HTTP e cosigrave Blobstore crea un blob dal contenuto delfile e restituisce un riferimento per il blob chiamato blob key che potragrave poi essereutilizzato per servire il blobQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Per poter scrivere un blob direttamente sul Datastore egrave necessario lrsquoutilizzodi una low-level API messa a disposizione da Google Files API Essa perograve

9httpswwwpythonanywherecom10httpopencvorg11httpscloudgooglecomappenginedocsjavablobstore

23 Metodologia utilizzata ed organizzazione del lavoro 8

egrave stata deprecata da Google12 in favore dellrsquoutilizzo del solo Google CloudStorage il quale offre un servizio di scrittura file-like similare

bull Google Cloud Datastore offre uno spazio di archiviazione limitato per lrsquoarchi-viazione dei blobs (5GB di spazio free) che si sarebbe saturato facilmente seavessimo scelto di caricare le immagini direttamente su di esso

222 Google Cloud Storage

Google Cloud Storage13 egrave un servizio Internet per memorizzare i dati nel cloud diGoogleQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Spazio di archiviazione free inferiore rispetto a quello offerto da Picasa (5GBdi spazio offerti da GCS contro i 15GB di spazio gratuito offerti da GoogleDrive e di conseguenza messi a disposizione per Picasa)

bull Maggiore efficienza nellrsquoupload riscontrata nei test effettuati

23 Metodologia utilizzata ed organizzazione del lavoro

231 Milestones

Il workshop Google Technologies for Cloud and Web Development nel quale egrave statorealizzato il progetto Art Everywhere ha previsto delle milestones intermedieovvero dei momenti di verifica del progetto nei quali egrave stato presentato lo stato diavanzamento del lavoro ed egrave stato valutato dallo staff e dai mentors del workshop

Per la prima milestone (Gennaio 2015) ci siamo concentrati sullo studiodelle tecnologie utilizzate per sviluppare un Minimum Viable Product con lo scopodi presentare e testare le principali caratteristiche dellrsquoapplicazione In particolareabbiamo sviluppato lrsquoUpload delle immagini e la Galleria principale usata permostrare le opere caricate dagli artisti

Per la seconda milestone (Febbraio 2015) ci siamo focalizzati sui feedbackricevuti nella precedente e sui bisogni dei nostri utenti (gli artisti) sottoponendo unsondaggio a piugrave di 50 artisti Sono state aggiunte altre caratteristiche come la Paginadellrsquoartista il Dettaglio opera e i Filtri di ricerca opere La Release Candidate egravestata testata da 10 utenti I risultati dei sondaggi sono stati presentati nel Capitolo 6

Lo scopo della terza milestone (Marzo 2015) era quello di presentare lrsquointe-ro progetto funzionante Lrsquoapplicazione egrave stata completata realizzando la partesocial (Likes Commenti e Condivisione) migliorando lrsquoUser Interface adottando ilMaterial Design e lrsquousabilitagrave dellrsquoapplicazione attraverso dei sondaggi condotti suun campione di utenti

12httpscloudgooglecomappenginedocspythongooglestorage13httpscloudgooglecomstoragedocsoverview

23 Metodologia utilizzata ed organizzazione del lavoro 9

La quarta milestone (Aprile 2015) rappresentava la Final Submission ovve-ro la presentazione del progetto davanti ad una giuria composta oltre che dallostaff del workshop da ingegneri Google Allrsquoapplicazione sono state aggiunte lapossibilitagrave di modificareeliminare unrsquoopera drsquoarte modificareaggiornare il profilodellrsquoartista segnalare un commento o unrsquoopera offensiva e visualizzare la lista dellepersone che hanno messo un Like ad unrsquoopera

232 Divisione del lavoro

Il progetto egrave stato realizzato come lavoro di gruppo durante il workshop GoogleTechnologies for Cloud and Web Development e la suddivisione del lavoro egrave derivatadallrsquoarchitettura three-tier usata come riferimento ovvero interfaccia utente logicafunzionale (business logic) e gestione dei dati persistenti Ciascuno ha poi svi-luppato una o piugrave funzionalitagrave che ha approfondito nella propria relazione al progetto

Il mio personale contributo che viene presentato in queste pagine ha ri-guardato gli algoritmi usati per il trasferimento (uploaddownload) efficiente delleopere drsquoarte ovvero di immagini e per la loro compressione prevenendo unaperdita significativa della qualitagrave Inoltre viene presentato il sistema realizzatoper il riconoscimento di pattern finalizzato ad individuare similaritagrave tra le operedrsquoarte presenti nel database e con opere drsquoarte famose in modo da individuare falsidrsquoautore e prevenire eventuali furti di proprietagrave intellettuale

233 Tool utilizzati

Per coordinare il lavoro abbiamo utilizzato GitHub14 un servizio web di hosting perlo sviluppo di progetti software che ci ha permesso di creare una repository15 perpoter condividere il codice del progetto e lavorare cosigrave simultaneamente Inoltreabbiamo ritenuto molto utile la funzione Issues che rappresenta un ottimo modoper tenere traccia delle attivitagrave miglioramenti e bug del progetto

Abbiamo effettuato revisioni continue circa ogni 23 giorni con lo scopo diverificare lrsquoavanzamento del lavoro in base alle milestones fissate Ciograve egrave avvenutotramite incontri fisici o tramite il servizio di messaggistica istantanea e VoIPHangout16 Google Drive17 egrave stato utilizzato per lrsquoarchiviazione e lo scambio didocumenti condivisi come ad esempio immagini documentazioni diagrammidellrsquoarchitettura e di progettazioneecc Survio18 egrave un software online per crearegratuitamente questionari e sondaggi ed egrave cosigrave stato utilizzato per sottoporre iquestionari presentati nel Capitolo 6 Infine abbiamo utilizzato Android Studio19lrsquoIDE ufficiale per lo sviluppo di applicazioni Android e PyCharm20un ambiente disviluppo per la programmazione Python

14httpsgithubcom15httpsgithubcomdavideaurucciArtEverywhere16httpwwwgooglecom+learnmorehangouts17httpdrivegooglecom18httpwwwsurviocomit19httpsdeveloperandroidcomsdkindexhtml20httpswwwjetbrainscompycharm

10

Capitolo 3

Analisi concettuale del sistema

In questo capitolo viene approfondita la conoscenza del dominio di interesse inmaniera tale da poter descrivere in modo preciso e completo cosa tale progettodeve realizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

31 Modello Entitagrave-Relazioni

LikeEntry

PictureEntryArtistEntry

FlagEntry

TechniqueEntry

CommentEntry

BlacklistEntry

CommentFlag PictureFlag FlaggedPicture

FlaggedComment

PictureParent

CommentBy CommentParent

PictureTechnique

Figura 31 Schema ER dellrsquoapplicazione

311 Vincoli non esprimibili nello schema

Non sono esprimibili nello schema i seguenti vincoli esterni

bull Vincolo sul numero segnalazioni di Visitor forall v isin Istanze(IVisitor)esiste al piugrave un fd isin Istanze(IFlagged) con fd = ltUserv FlagEntryfgt

bull Vincolo sullrsquoattributo likes forall p isin Istanze(IPictureEntry) sia I = ltPictu-reEntryp ArtistEntry agt isin Istanze(ILikeEntry) | a isin Istanze(IArtistEntry)

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

12 Screenshots delle principali funzionalitagrave 2

che non possono piugrave utilizzarla Di una entry della lista nera interessa sapere chi egravelrsquoutente coinvolto In particolare un utente visitatore finisce in lista nera alla primasegnalazione ricevuta mentre un utente artista finisce in lista nera solo dopo cheavendo valutato le segnalazioni ricevute si ritiene che esso debba essere inserito inessa A tale scopo per lrsquoartista si memorizza una proprietagrave aggiuntiva che tieneconto della gravitagrave dello storico delle segnalazioni precedenti

12 Screenshots delle principali funzionalitagrave

Figura 11 Galleria principale Figura 12 Profilo Artista

Figura 13 Dettaglio Opera Figura 14 Commenti

3

Capitolo 2

Tecnologie e metodologie usate

In questo capitolo verranno presentate le principali tecnologie utilizzate specificandole funzionalitagrave delle tecnologie attualmente in uso e le motivazioni che ci hannospinto ad abbandonare alcune tecnologie In seguito verragrave presentata la metodologiautilizzata nella conduzione del progetto durante il periodo del workshop Google e larelativa organizzazione del lavoro tra i componenti del gruppo

21 Tecnologie in uso

211 Google App Engine

Google App Engine1 (GAE) egrave una Platform as a Service (PaaS) che consente dicreare ed eseguire applicazioni web sullrsquoinfrastruttura di Google GAE offre unascalabilitagrave automatica per le applicazioni a seconda del numero di richieste drsquousoper quella applicazione ed alloca in automatico piugrave risorse per gestire la doman-da addizionale Le applicazioni vengono eseguite in un ambiente sandbox sicuropermettendo la distribuzione delle richieste su piugrave server e la scalabilitagrave dei serverper soddisfare le richieste di traffico GAE supporta app scritte in una varietagrave dilinguaggi di programmazione come Java Python PHP e GoPer lo sviluppo di Art Everywhere si egrave scelto utilizzare il linguaggio di programma-zione Python e quindi di realizzare una Python web app che rappresenta il backenddellrsquoapplicazione

212 Google Cloud Endpoints

Google Cloud Endpoints2 (GCE) egrave un insieme di strumenti librerie e funzionalitagraveche consentono di generare API e librerie client da unrsquoapplicazione GAE (backend)per semplificare lrsquoaccesso client ai dati da altre applicazioni GCE utilizza la libreriaGoogle Protocol RPC un protocollo per lrsquoinvocazione remota di procedure HTTP-based Egrave possibile definire un servizio RPC in una singola classe Python che contieneun certo numero di metodi remoti dichiarati Ogni metodo remoto accetta un insiemespecifico di parametri come richiesta e restituisce una risposta specifica Questiparametri di richiesta e di risposta sono le classi definite dallrsquoutente note come

1httpscloudgooglecomappengine2httpscloudgooglecomappenginedocsjavaendpoints

21 Tecnologie in uso 4

Tabella 21 Parametri accettati da un metodo remoto

Request Message Class La classe del messaggio di richiesta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Response Message Class La classe del messaggio di risposta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Name Nome alternativo al metodoPath Il percorso URI da usare per accedere al

metodoHttp method Il metodo HTTP da usare (GET POST

ecc)

messaggi (ProtoRPC Messages) La Tabella 21 mostra i parametri accettati daimetodi remotiDopo aver completato la creazione dei vari metodi egrave possibile auto-generare lelibrerie per il client e quindi da importare nellrsquoapplicazione mobile Nel caso diArt Everywhere le librerie sono scritte in Java dato che si egrave scelto di realizzareunrsquoapplicazione Android Per autogenerare le librerie per il client egrave necessario usareil seguente comando da linea di comando

google_appengineendpointscfgpy ltcommandgt lttarget_langgt ltoptionsgt[class-name]

bull ltcommandgt puograve essere get_client_lib o get_discovery_doc

bull lttarget_langgt (usato solo con get_client_lib) specifica il tipo di pacchettoche si desidera creare Si egrave tenuti ad inserire il valore java per i client Javacome Android

bull ltoptiongt se fornito indica una o piugrave opzioni disponibili Ad esempio build-system specifica il tipo di bundle da produrre Si egrave tenuti a specificare gradleper i client Android

bull [class name] egrave il nome completo della classe

213 Google Cloud Datastore

Google Cloud Datastore3 (GCD) fornisce lrsquoarchiviazione dei dati senza richiedereuno schema fisso (NoSQL) garantendo una memorizzazione robusta e scalabile perle applicazioniA differenza dei tradizionali database relazionali GCD utilizza unrsquoarchitetturadistribuita per gestire automaticamente la scalabilitagrave fino a grandi insiemi di datiPoicheacute tutte le query sono servite da indici predefiniti i tipi di query che possonoessere eseguite sono piugrave restrittive rispetto a quelle consentite su un databaserelazionale con SQL In particolare non sono supportate le seguenti operazioni

3httpscloudgooglecomdatastoredocsconceptsoverview

21 Tecnologie in uso 5

join disuguaglianza di filtraggio su piugrave proprietagrave filtraggio dei dati sulla base deirisultati di una subqueryGCD salva gli oggetti di dati come entitagrave Unrsquoentitagrave ha una o piugrave proprietagrave icui valori possono essere uno dei diversi tipi di dati supportati per esempio unaproprietagrave puograve essere una stringa un numero intero o un riferimento ad unrsquoaltraentitagrave Ogni entitagrave egrave identificato dal suo genere che categorizza lrsquoentitagrave al fine dipoter effettuare query e una chiave che la identifica in modo univoco allrsquointerno delsuo genere

In Art Everywhere abbiamo utilizzato Python NDB Datastore API per po-ter definire modelli allrsquointerno di unrsquoapplicazione App Engine Un modello egrave unaclasse Python che agisce come una sorta di schema di database descrive un tipo didati in termini di proprietagrave

Nel capitolo 3 verragrave approfondita lrsquoanalisi concettuale del progetto che porteragrave alladefinizione del modello della base di dati utilizzata

214 Picasa Web Albums Data API

Le API di Picasa Web Albums consentono a siti web e applicazioni mobili di integrarsicon Picasa un software grafico per organizzare e modificare fotografie digitali evideo e di condividerle con altri utenti nei ldquoweb albumrdquoArt Everywhere memorizza tutte le immagini caricate dagli utenti su Picasa WebAlbums Usando lrsquoaccount Google dellrsquoapplicazione tutte le immagini (inviate daldispositivo mobile) vengono memorizzate dal backend in un web album chiamatoldquoArt Everywhererdquo e accessibile a chiunque tramite URL Tali URL vengono memo-rizzate nel database come una proprietagrave (url) della entitagrave PictureEntryDa App Engine lrsquoupload delle immagini su Picasa Web Album viene effettuatousando la libreria Google Data Python

215 Android

Android4 egrave un sistema operativo per dispositivi mobili sviluppato da Google Incbasato su kernel Linux e distribuito sotto i termini della licenza Apache 20 checonsente di modificare e distribuire liberamente il codice sorgentePer lo sviluppo di Art Everywhere egrave stato utilizzato Android Studio lrsquoIDE ufficialeper lo sviluppo di applicazioni Android basato su IntelliJ Idea e si egrave scelto di renderedisponibile lrsquoapplicazione a partire dalla versione sdk 15+ ovvero compatibile apartire dalla versione Android 40 (Ice Cream Sandwich)

216 Python

Python5 egrave un linguaggio di programmazione orientato agli oggetti e utilizzabile permolti tipi di sviluppo software Ersquo stato utilizzato per la realizzazione del backenddi Art Everyhwere sottoforma di una Python web app che interagisce con il web

4httpsitwikipediaorgwikiAndroid5httpswwwpythonorg

21 Tecnologie in uso 6

server GAE usando il protocollo WSGI6 In particolare egrave stato utilizzato webapp2un framework WSGI compatibile che consente di creare rapidamente sempliciapplicazioni web per il runtime di Python 27 Infatti la Python web app vieneeseguita da GAE utilizzando il linguaggio pre-caricato Python in un ambiente sicurosandbox Si tratta di un ambiente Python puro lrsquointerprete Python puograve eseguirequalsiasi codice Python ma non puograve caricare moduli Python che contengono codiceC

Inoltre in Art Everywhere il linguaggio di programmazione Python egrave statoutilizzato per codificare lrsquoalgoritmo di pattern recognition utilizzando la libreriaOpenCV (2110) il framework web Flask (218) e caricando il codice sul servizio dihosting PythonAnywhere (219)

217 OAuth 20

OAuth 20 egrave un protocollo aperto che garantisce ai service provider lrsquoaccesso daparte di terzi ai dati degli utenti proteggendo contemporanemente le loro credenzialiErsquo utilizzato dalle API di Google (ad esempio effettuare il login usando lrsquoaccountGoogle) per lrsquoautenticazione e le autorizzazioni e tutte le applicazioni seguono unpattern quando si accede ad un API di Google usando OAuth 20

bull ottenere le credenziali dalla Google Developer Console7 cioegrave il clientID e client secret che sono noti solamente a Google e alla propria applicazione

bull ottenere un token di accesso dal Server delle Autorizzazioni di Goo-gle prima che lrsquoapplicazione possa accedere ai dati privati tramite un API diGoogle si deve ottenere un token di accesso che concede lrsquoaccesso a tale APIUn parametro variabile di nome scope controlla lrsquoinsieme di risorse e delle ope-razioni che un token di accesso permette Se lrsquoutente concede lrsquoautorizzazioneil Server delle Autorizzazioni Google invia allrsquoapplicazione un token di accessoSe lrsquoutente non concede lrsquoautorizzazione il server restituisce un errore

bull inviare token di accesso ad uno specifico API in un header HTTP diautorizzazione

bull aggiornare il token di accesso se necessario poichegrave hanno una duratalimitata

218 Flask

Flask8 egrave un framework web scritto in Python e basato sullo strumento Werkzeug(libreria di utilitagrave HTTP e WSGI per Python) e con il motore template Jinja2 Flaskviene chiamato microframework percheacute non forza uno sviluppatore ad utilizzare un

6httpsitwikipediaorgwikiWeb_Server_Gateway_Interface Il Web Server Gateway In-terface (WSGI) egrave un protocollo di trasmissione che stabilisce e descrive comunicazioni ed interazionitra server ed applicazioni web scritte nel linguaggio Python Egrave quindi lrsquointerfaccia standard del webservice per la programmazione in Python

7httpsconsoledevelopersgooglecom8httpflaskpocooorgdocs010

22 Tecnologie abbandonate 7

particolare strumento o una libreria Non ha alcun livello di astrazione del databasela validazione dei form o qualsiasi altro componente in cui librerie di terze partipre-esistenti forniscono funzioni comuniIn Art Everywhere Flask egrave stato usato per realizzare unrsquoapplicazione web contenentelrsquoalgoritmo di pattern recognition per la similaritagrave tra immagini (53) e permetterecosigrave richieste RESTful effettuate dal backend

219 PythonAnywhere

PythonAnywhere9 egrave un servizio di hosting Web basato sul linguaggio di program-mazione Python Le applicazioni web ospitate possono essere scritte utilizzandoqualsiasi applicazione basata su framework WSGI con Art Everywhere abbiamoutilizzato Flask

2110 OpenCV

OpenCV10 egrave una libreria open source per software di computer vision e machinelearning OpenCV egrave stato realizzato per fornire una infrastruttura comune perapplicazioni di computer vision La libreria dispone metodi che possono essereutilizzati per rilevare e riconoscere i volti umani identificare oggetti classificare leazioni umane nei video tracciare movimenti di macchine su pista estrarre modelli3D di oggetti seguire i movimenti degli occhi riconoscere scenari eccDispone di interfacce C++ C Python Java e MATLAB e supporta WindowsLinux Android e Mac OS

In Art Everywhere tale libreria egrave stata utilizzata per realizzare lrsquoalgoritmodi pattern recognition per la similaritagrave tra immagini (53) utilizzando lrsquointerfacciaPython in ambiente Linux

22 Tecnologie abbandonate

221 Google BlobStore API

BlobStore API11 consente alle applicazioni di servire oggetti di dati chiamati blobche sono molto piugrave grandi della dimensione consentita per oggetti nel servizioDatastore come ad esempio i file video o immagini Blobs sono creati caricandoun file tramite una richiesta HTTP e cosigrave Blobstore crea un blob dal contenuto delfile e restituisce un riferimento per il blob chiamato blob key che potragrave poi essereutilizzato per servire il blobQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Per poter scrivere un blob direttamente sul Datastore egrave necessario lrsquoutilizzodi una low-level API messa a disposizione da Google Files API Essa perograve

9httpswwwpythonanywherecom10httpopencvorg11httpscloudgooglecomappenginedocsjavablobstore

23 Metodologia utilizzata ed organizzazione del lavoro 8

egrave stata deprecata da Google12 in favore dellrsquoutilizzo del solo Google CloudStorage il quale offre un servizio di scrittura file-like similare

bull Google Cloud Datastore offre uno spazio di archiviazione limitato per lrsquoarchi-viazione dei blobs (5GB di spazio free) che si sarebbe saturato facilmente seavessimo scelto di caricare le immagini direttamente su di esso

222 Google Cloud Storage

Google Cloud Storage13 egrave un servizio Internet per memorizzare i dati nel cloud diGoogleQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Spazio di archiviazione free inferiore rispetto a quello offerto da Picasa (5GBdi spazio offerti da GCS contro i 15GB di spazio gratuito offerti da GoogleDrive e di conseguenza messi a disposizione per Picasa)

bull Maggiore efficienza nellrsquoupload riscontrata nei test effettuati

23 Metodologia utilizzata ed organizzazione del lavoro

231 Milestones

Il workshop Google Technologies for Cloud and Web Development nel quale egrave statorealizzato il progetto Art Everywhere ha previsto delle milestones intermedieovvero dei momenti di verifica del progetto nei quali egrave stato presentato lo stato diavanzamento del lavoro ed egrave stato valutato dallo staff e dai mentors del workshop

Per la prima milestone (Gennaio 2015) ci siamo concentrati sullo studiodelle tecnologie utilizzate per sviluppare un Minimum Viable Product con lo scopodi presentare e testare le principali caratteristiche dellrsquoapplicazione In particolareabbiamo sviluppato lrsquoUpload delle immagini e la Galleria principale usata permostrare le opere caricate dagli artisti

Per la seconda milestone (Febbraio 2015) ci siamo focalizzati sui feedbackricevuti nella precedente e sui bisogni dei nostri utenti (gli artisti) sottoponendo unsondaggio a piugrave di 50 artisti Sono state aggiunte altre caratteristiche come la Paginadellrsquoartista il Dettaglio opera e i Filtri di ricerca opere La Release Candidate egravestata testata da 10 utenti I risultati dei sondaggi sono stati presentati nel Capitolo 6

Lo scopo della terza milestone (Marzo 2015) era quello di presentare lrsquointe-ro progetto funzionante Lrsquoapplicazione egrave stata completata realizzando la partesocial (Likes Commenti e Condivisione) migliorando lrsquoUser Interface adottando ilMaterial Design e lrsquousabilitagrave dellrsquoapplicazione attraverso dei sondaggi condotti suun campione di utenti

12httpscloudgooglecomappenginedocspythongooglestorage13httpscloudgooglecomstoragedocsoverview

23 Metodologia utilizzata ed organizzazione del lavoro 9

La quarta milestone (Aprile 2015) rappresentava la Final Submission ovve-ro la presentazione del progetto davanti ad una giuria composta oltre che dallostaff del workshop da ingegneri Google Allrsquoapplicazione sono state aggiunte lapossibilitagrave di modificareeliminare unrsquoopera drsquoarte modificareaggiornare il profilodellrsquoartista segnalare un commento o unrsquoopera offensiva e visualizzare la lista dellepersone che hanno messo un Like ad unrsquoopera

232 Divisione del lavoro

Il progetto egrave stato realizzato come lavoro di gruppo durante il workshop GoogleTechnologies for Cloud and Web Development e la suddivisione del lavoro egrave derivatadallrsquoarchitettura three-tier usata come riferimento ovvero interfaccia utente logicafunzionale (business logic) e gestione dei dati persistenti Ciascuno ha poi svi-luppato una o piugrave funzionalitagrave che ha approfondito nella propria relazione al progetto

Il mio personale contributo che viene presentato in queste pagine ha ri-guardato gli algoritmi usati per il trasferimento (uploaddownload) efficiente delleopere drsquoarte ovvero di immagini e per la loro compressione prevenendo unaperdita significativa della qualitagrave Inoltre viene presentato il sistema realizzatoper il riconoscimento di pattern finalizzato ad individuare similaritagrave tra le operedrsquoarte presenti nel database e con opere drsquoarte famose in modo da individuare falsidrsquoautore e prevenire eventuali furti di proprietagrave intellettuale

233 Tool utilizzati

Per coordinare il lavoro abbiamo utilizzato GitHub14 un servizio web di hosting perlo sviluppo di progetti software che ci ha permesso di creare una repository15 perpoter condividere il codice del progetto e lavorare cosigrave simultaneamente Inoltreabbiamo ritenuto molto utile la funzione Issues che rappresenta un ottimo modoper tenere traccia delle attivitagrave miglioramenti e bug del progetto

Abbiamo effettuato revisioni continue circa ogni 23 giorni con lo scopo diverificare lrsquoavanzamento del lavoro in base alle milestones fissate Ciograve egrave avvenutotramite incontri fisici o tramite il servizio di messaggistica istantanea e VoIPHangout16 Google Drive17 egrave stato utilizzato per lrsquoarchiviazione e lo scambio didocumenti condivisi come ad esempio immagini documentazioni diagrammidellrsquoarchitettura e di progettazioneecc Survio18 egrave un software online per crearegratuitamente questionari e sondaggi ed egrave cosigrave stato utilizzato per sottoporre iquestionari presentati nel Capitolo 6 Infine abbiamo utilizzato Android Studio19lrsquoIDE ufficiale per lo sviluppo di applicazioni Android e PyCharm20un ambiente disviluppo per la programmazione Python

14httpsgithubcom15httpsgithubcomdavideaurucciArtEverywhere16httpwwwgooglecom+learnmorehangouts17httpdrivegooglecom18httpwwwsurviocomit19httpsdeveloperandroidcomsdkindexhtml20httpswwwjetbrainscompycharm

10

Capitolo 3

Analisi concettuale del sistema

In questo capitolo viene approfondita la conoscenza del dominio di interesse inmaniera tale da poter descrivere in modo preciso e completo cosa tale progettodeve realizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

31 Modello Entitagrave-Relazioni

LikeEntry

PictureEntryArtistEntry

FlagEntry

TechniqueEntry

CommentEntry

BlacklistEntry

CommentFlag PictureFlag FlaggedPicture

FlaggedComment

PictureParent

CommentBy CommentParent

PictureTechnique

Figura 31 Schema ER dellrsquoapplicazione

311 Vincoli non esprimibili nello schema

Non sono esprimibili nello schema i seguenti vincoli esterni

bull Vincolo sul numero segnalazioni di Visitor forall v isin Istanze(IVisitor)esiste al piugrave un fd isin Istanze(IFlagged) con fd = ltUserv FlagEntryfgt

bull Vincolo sullrsquoattributo likes forall p isin Istanze(IPictureEntry) sia I = ltPictu-reEntryp ArtistEntry agt isin Istanze(ILikeEntry) | a isin Istanze(IArtistEntry)

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

3

Capitolo 2

Tecnologie e metodologie usate

In questo capitolo verranno presentate le principali tecnologie utilizzate specificandole funzionalitagrave delle tecnologie attualmente in uso e le motivazioni che ci hannospinto ad abbandonare alcune tecnologie In seguito verragrave presentata la metodologiautilizzata nella conduzione del progetto durante il periodo del workshop Google e larelativa organizzazione del lavoro tra i componenti del gruppo

21 Tecnologie in uso

211 Google App Engine

Google App Engine1 (GAE) egrave una Platform as a Service (PaaS) che consente dicreare ed eseguire applicazioni web sullrsquoinfrastruttura di Google GAE offre unascalabilitagrave automatica per le applicazioni a seconda del numero di richieste drsquousoper quella applicazione ed alloca in automatico piugrave risorse per gestire la doman-da addizionale Le applicazioni vengono eseguite in un ambiente sandbox sicuropermettendo la distribuzione delle richieste su piugrave server e la scalabilitagrave dei serverper soddisfare le richieste di traffico GAE supporta app scritte in una varietagrave dilinguaggi di programmazione come Java Python PHP e GoPer lo sviluppo di Art Everywhere si egrave scelto utilizzare il linguaggio di programma-zione Python e quindi di realizzare una Python web app che rappresenta il backenddellrsquoapplicazione

212 Google Cloud Endpoints

Google Cloud Endpoints2 (GCE) egrave un insieme di strumenti librerie e funzionalitagraveche consentono di generare API e librerie client da unrsquoapplicazione GAE (backend)per semplificare lrsquoaccesso client ai dati da altre applicazioni GCE utilizza la libreriaGoogle Protocol RPC un protocollo per lrsquoinvocazione remota di procedure HTTP-based Egrave possibile definire un servizio RPC in una singola classe Python che contieneun certo numero di metodi remoti dichiarati Ogni metodo remoto accetta un insiemespecifico di parametri come richiesta e restituisce una risposta specifica Questiparametri di richiesta e di risposta sono le classi definite dallrsquoutente note come

1httpscloudgooglecomappengine2httpscloudgooglecomappenginedocsjavaendpoints

21 Tecnologie in uso 4

Tabella 21 Parametri accettati da un metodo remoto

Request Message Class La classe del messaggio di richiesta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Response Message Class La classe del messaggio di risposta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Name Nome alternativo al metodoPath Il percorso URI da usare per accedere al

metodoHttp method Il metodo HTTP da usare (GET POST

ecc)

messaggi (ProtoRPC Messages) La Tabella 21 mostra i parametri accettati daimetodi remotiDopo aver completato la creazione dei vari metodi egrave possibile auto-generare lelibrerie per il client e quindi da importare nellrsquoapplicazione mobile Nel caso diArt Everywhere le librerie sono scritte in Java dato che si egrave scelto di realizzareunrsquoapplicazione Android Per autogenerare le librerie per il client egrave necessario usareil seguente comando da linea di comando

google_appengineendpointscfgpy ltcommandgt lttarget_langgt ltoptionsgt[class-name]

bull ltcommandgt puograve essere get_client_lib o get_discovery_doc

bull lttarget_langgt (usato solo con get_client_lib) specifica il tipo di pacchettoche si desidera creare Si egrave tenuti ad inserire il valore java per i client Javacome Android

bull ltoptiongt se fornito indica una o piugrave opzioni disponibili Ad esempio build-system specifica il tipo di bundle da produrre Si egrave tenuti a specificare gradleper i client Android

bull [class name] egrave il nome completo della classe

213 Google Cloud Datastore

Google Cloud Datastore3 (GCD) fornisce lrsquoarchiviazione dei dati senza richiedereuno schema fisso (NoSQL) garantendo una memorizzazione robusta e scalabile perle applicazioniA differenza dei tradizionali database relazionali GCD utilizza unrsquoarchitetturadistribuita per gestire automaticamente la scalabilitagrave fino a grandi insiemi di datiPoicheacute tutte le query sono servite da indici predefiniti i tipi di query che possonoessere eseguite sono piugrave restrittive rispetto a quelle consentite su un databaserelazionale con SQL In particolare non sono supportate le seguenti operazioni

3httpscloudgooglecomdatastoredocsconceptsoverview

21 Tecnologie in uso 5

join disuguaglianza di filtraggio su piugrave proprietagrave filtraggio dei dati sulla base deirisultati di una subqueryGCD salva gli oggetti di dati come entitagrave Unrsquoentitagrave ha una o piugrave proprietagrave icui valori possono essere uno dei diversi tipi di dati supportati per esempio unaproprietagrave puograve essere una stringa un numero intero o un riferimento ad unrsquoaltraentitagrave Ogni entitagrave egrave identificato dal suo genere che categorizza lrsquoentitagrave al fine dipoter effettuare query e una chiave che la identifica in modo univoco allrsquointerno delsuo genere

In Art Everywhere abbiamo utilizzato Python NDB Datastore API per po-ter definire modelli allrsquointerno di unrsquoapplicazione App Engine Un modello egrave unaclasse Python che agisce come una sorta di schema di database descrive un tipo didati in termini di proprietagrave

Nel capitolo 3 verragrave approfondita lrsquoanalisi concettuale del progetto che porteragrave alladefinizione del modello della base di dati utilizzata

214 Picasa Web Albums Data API

Le API di Picasa Web Albums consentono a siti web e applicazioni mobili di integrarsicon Picasa un software grafico per organizzare e modificare fotografie digitali evideo e di condividerle con altri utenti nei ldquoweb albumrdquoArt Everywhere memorizza tutte le immagini caricate dagli utenti su Picasa WebAlbums Usando lrsquoaccount Google dellrsquoapplicazione tutte le immagini (inviate daldispositivo mobile) vengono memorizzate dal backend in un web album chiamatoldquoArt Everywhererdquo e accessibile a chiunque tramite URL Tali URL vengono memo-rizzate nel database come una proprietagrave (url) della entitagrave PictureEntryDa App Engine lrsquoupload delle immagini su Picasa Web Album viene effettuatousando la libreria Google Data Python

215 Android

Android4 egrave un sistema operativo per dispositivi mobili sviluppato da Google Incbasato su kernel Linux e distribuito sotto i termini della licenza Apache 20 checonsente di modificare e distribuire liberamente il codice sorgentePer lo sviluppo di Art Everywhere egrave stato utilizzato Android Studio lrsquoIDE ufficialeper lo sviluppo di applicazioni Android basato su IntelliJ Idea e si egrave scelto di renderedisponibile lrsquoapplicazione a partire dalla versione sdk 15+ ovvero compatibile apartire dalla versione Android 40 (Ice Cream Sandwich)

216 Python

Python5 egrave un linguaggio di programmazione orientato agli oggetti e utilizzabile permolti tipi di sviluppo software Ersquo stato utilizzato per la realizzazione del backenddi Art Everyhwere sottoforma di una Python web app che interagisce con il web

4httpsitwikipediaorgwikiAndroid5httpswwwpythonorg

21 Tecnologie in uso 6

server GAE usando il protocollo WSGI6 In particolare egrave stato utilizzato webapp2un framework WSGI compatibile che consente di creare rapidamente sempliciapplicazioni web per il runtime di Python 27 Infatti la Python web app vieneeseguita da GAE utilizzando il linguaggio pre-caricato Python in un ambiente sicurosandbox Si tratta di un ambiente Python puro lrsquointerprete Python puograve eseguirequalsiasi codice Python ma non puograve caricare moduli Python che contengono codiceC

Inoltre in Art Everywhere il linguaggio di programmazione Python egrave statoutilizzato per codificare lrsquoalgoritmo di pattern recognition utilizzando la libreriaOpenCV (2110) il framework web Flask (218) e caricando il codice sul servizio dihosting PythonAnywhere (219)

217 OAuth 20

OAuth 20 egrave un protocollo aperto che garantisce ai service provider lrsquoaccesso daparte di terzi ai dati degli utenti proteggendo contemporanemente le loro credenzialiErsquo utilizzato dalle API di Google (ad esempio effettuare il login usando lrsquoaccountGoogle) per lrsquoautenticazione e le autorizzazioni e tutte le applicazioni seguono unpattern quando si accede ad un API di Google usando OAuth 20

bull ottenere le credenziali dalla Google Developer Console7 cioegrave il clientID e client secret che sono noti solamente a Google e alla propria applicazione

bull ottenere un token di accesso dal Server delle Autorizzazioni di Goo-gle prima che lrsquoapplicazione possa accedere ai dati privati tramite un API diGoogle si deve ottenere un token di accesso che concede lrsquoaccesso a tale APIUn parametro variabile di nome scope controlla lrsquoinsieme di risorse e delle ope-razioni che un token di accesso permette Se lrsquoutente concede lrsquoautorizzazioneil Server delle Autorizzazioni Google invia allrsquoapplicazione un token di accessoSe lrsquoutente non concede lrsquoautorizzazione il server restituisce un errore

bull inviare token di accesso ad uno specifico API in un header HTTP diautorizzazione

bull aggiornare il token di accesso se necessario poichegrave hanno una duratalimitata

218 Flask

Flask8 egrave un framework web scritto in Python e basato sullo strumento Werkzeug(libreria di utilitagrave HTTP e WSGI per Python) e con il motore template Jinja2 Flaskviene chiamato microframework percheacute non forza uno sviluppatore ad utilizzare un

6httpsitwikipediaorgwikiWeb_Server_Gateway_Interface Il Web Server Gateway In-terface (WSGI) egrave un protocollo di trasmissione che stabilisce e descrive comunicazioni ed interazionitra server ed applicazioni web scritte nel linguaggio Python Egrave quindi lrsquointerfaccia standard del webservice per la programmazione in Python

7httpsconsoledevelopersgooglecom8httpflaskpocooorgdocs010

22 Tecnologie abbandonate 7

particolare strumento o una libreria Non ha alcun livello di astrazione del databasela validazione dei form o qualsiasi altro componente in cui librerie di terze partipre-esistenti forniscono funzioni comuniIn Art Everywhere Flask egrave stato usato per realizzare unrsquoapplicazione web contenentelrsquoalgoritmo di pattern recognition per la similaritagrave tra immagini (53) e permetterecosigrave richieste RESTful effettuate dal backend

219 PythonAnywhere

PythonAnywhere9 egrave un servizio di hosting Web basato sul linguaggio di program-mazione Python Le applicazioni web ospitate possono essere scritte utilizzandoqualsiasi applicazione basata su framework WSGI con Art Everywhere abbiamoutilizzato Flask

2110 OpenCV

OpenCV10 egrave una libreria open source per software di computer vision e machinelearning OpenCV egrave stato realizzato per fornire una infrastruttura comune perapplicazioni di computer vision La libreria dispone metodi che possono essereutilizzati per rilevare e riconoscere i volti umani identificare oggetti classificare leazioni umane nei video tracciare movimenti di macchine su pista estrarre modelli3D di oggetti seguire i movimenti degli occhi riconoscere scenari eccDispone di interfacce C++ C Python Java e MATLAB e supporta WindowsLinux Android e Mac OS

In Art Everywhere tale libreria egrave stata utilizzata per realizzare lrsquoalgoritmodi pattern recognition per la similaritagrave tra immagini (53) utilizzando lrsquointerfacciaPython in ambiente Linux

22 Tecnologie abbandonate

221 Google BlobStore API

BlobStore API11 consente alle applicazioni di servire oggetti di dati chiamati blobche sono molto piugrave grandi della dimensione consentita per oggetti nel servizioDatastore come ad esempio i file video o immagini Blobs sono creati caricandoun file tramite una richiesta HTTP e cosigrave Blobstore crea un blob dal contenuto delfile e restituisce un riferimento per il blob chiamato blob key che potragrave poi essereutilizzato per servire il blobQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Per poter scrivere un blob direttamente sul Datastore egrave necessario lrsquoutilizzodi una low-level API messa a disposizione da Google Files API Essa perograve

9httpswwwpythonanywherecom10httpopencvorg11httpscloudgooglecomappenginedocsjavablobstore

23 Metodologia utilizzata ed organizzazione del lavoro 8

egrave stata deprecata da Google12 in favore dellrsquoutilizzo del solo Google CloudStorage il quale offre un servizio di scrittura file-like similare

bull Google Cloud Datastore offre uno spazio di archiviazione limitato per lrsquoarchi-viazione dei blobs (5GB di spazio free) che si sarebbe saturato facilmente seavessimo scelto di caricare le immagini direttamente su di esso

222 Google Cloud Storage

Google Cloud Storage13 egrave un servizio Internet per memorizzare i dati nel cloud diGoogleQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Spazio di archiviazione free inferiore rispetto a quello offerto da Picasa (5GBdi spazio offerti da GCS contro i 15GB di spazio gratuito offerti da GoogleDrive e di conseguenza messi a disposizione per Picasa)

bull Maggiore efficienza nellrsquoupload riscontrata nei test effettuati

23 Metodologia utilizzata ed organizzazione del lavoro

231 Milestones

Il workshop Google Technologies for Cloud and Web Development nel quale egrave statorealizzato il progetto Art Everywhere ha previsto delle milestones intermedieovvero dei momenti di verifica del progetto nei quali egrave stato presentato lo stato diavanzamento del lavoro ed egrave stato valutato dallo staff e dai mentors del workshop

Per la prima milestone (Gennaio 2015) ci siamo concentrati sullo studiodelle tecnologie utilizzate per sviluppare un Minimum Viable Product con lo scopodi presentare e testare le principali caratteristiche dellrsquoapplicazione In particolareabbiamo sviluppato lrsquoUpload delle immagini e la Galleria principale usata permostrare le opere caricate dagli artisti

Per la seconda milestone (Febbraio 2015) ci siamo focalizzati sui feedbackricevuti nella precedente e sui bisogni dei nostri utenti (gli artisti) sottoponendo unsondaggio a piugrave di 50 artisti Sono state aggiunte altre caratteristiche come la Paginadellrsquoartista il Dettaglio opera e i Filtri di ricerca opere La Release Candidate egravestata testata da 10 utenti I risultati dei sondaggi sono stati presentati nel Capitolo 6

Lo scopo della terza milestone (Marzo 2015) era quello di presentare lrsquointe-ro progetto funzionante Lrsquoapplicazione egrave stata completata realizzando la partesocial (Likes Commenti e Condivisione) migliorando lrsquoUser Interface adottando ilMaterial Design e lrsquousabilitagrave dellrsquoapplicazione attraverso dei sondaggi condotti suun campione di utenti

12httpscloudgooglecomappenginedocspythongooglestorage13httpscloudgooglecomstoragedocsoverview

23 Metodologia utilizzata ed organizzazione del lavoro 9

La quarta milestone (Aprile 2015) rappresentava la Final Submission ovve-ro la presentazione del progetto davanti ad una giuria composta oltre che dallostaff del workshop da ingegneri Google Allrsquoapplicazione sono state aggiunte lapossibilitagrave di modificareeliminare unrsquoopera drsquoarte modificareaggiornare il profilodellrsquoartista segnalare un commento o unrsquoopera offensiva e visualizzare la lista dellepersone che hanno messo un Like ad unrsquoopera

232 Divisione del lavoro

Il progetto egrave stato realizzato come lavoro di gruppo durante il workshop GoogleTechnologies for Cloud and Web Development e la suddivisione del lavoro egrave derivatadallrsquoarchitettura three-tier usata come riferimento ovvero interfaccia utente logicafunzionale (business logic) e gestione dei dati persistenti Ciascuno ha poi svi-luppato una o piugrave funzionalitagrave che ha approfondito nella propria relazione al progetto

Il mio personale contributo che viene presentato in queste pagine ha ri-guardato gli algoritmi usati per il trasferimento (uploaddownload) efficiente delleopere drsquoarte ovvero di immagini e per la loro compressione prevenendo unaperdita significativa della qualitagrave Inoltre viene presentato il sistema realizzatoper il riconoscimento di pattern finalizzato ad individuare similaritagrave tra le operedrsquoarte presenti nel database e con opere drsquoarte famose in modo da individuare falsidrsquoautore e prevenire eventuali furti di proprietagrave intellettuale

233 Tool utilizzati

Per coordinare il lavoro abbiamo utilizzato GitHub14 un servizio web di hosting perlo sviluppo di progetti software che ci ha permesso di creare una repository15 perpoter condividere il codice del progetto e lavorare cosigrave simultaneamente Inoltreabbiamo ritenuto molto utile la funzione Issues che rappresenta un ottimo modoper tenere traccia delle attivitagrave miglioramenti e bug del progetto

Abbiamo effettuato revisioni continue circa ogni 23 giorni con lo scopo diverificare lrsquoavanzamento del lavoro in base alle milestones fissate Ciograve egrave avvenutotramite incontri fisici o tramite il servizio di messaggistica istantanea e VoIPHangout16 Google Drive17 egrave stato utilizzato per lrsquoarchiviazione e lo scambio didocumenti condivisi come ad esempio immagini documentazioni diagrammidellrsquoarchitettura e di progettazioneecc Survio18 egrave un software online per crearegratuitamente questionari e sondaggi ed egrave cosigrave stato utilizzato per sottoporre iquestionari presentati nel Capitolo 6 Infine abbiamo utilizzato Android Studio19lrsquoIDE ufficiale per lo sviluppo di applicazioni Android e PyCharm20un ambiente disviluppo per la programmazione Python

14httpsgithubcom15httpsgithubcomdavideaurucciArtEverywhere16httpwwwgooglecom+learnmorehangouts17httpdrivegooglecom18httpwwwsurviocomit19httpsdeveloperandroidcomsdkindexhtml20httpswwwjetbrainscompycharm

10

Capitolo 3

Analisi concettuale del sistema

In questo capitolo viene approfondita la conoscenza del dominio di interesse inmaniera tale da poter descrivere in modo preciso e completo cosa tale progettodeve realizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

31 Modello Entitagrave-Relazioni

LikeEntry

PictureEntryArtistEntry

FlagEntry

TechniqueEntry

CommentEntry

BlacklistEntry

CommentFlag PictureFlag FlaggedPicture

FlaggedComment

PictureParent

CommentBy CommentParent

PictureTechnique

Figura 31 Schema ER dellrsquoapplicazione

311 Vincoli non esprimibili nello schema

Non sono esprimibili nello schema i seguenti vincoli esterni

bull Vincolo sul numero segnalazioni di Visitor forall v isin Istanze(IVisitor)esiste al piugrave un fd isin Istanze(IFlagged) con fd = ltUserv FlagEntryfgt

bull Vincolo sullrsquoattributo likes forall p isin Istanze(IPictureEntry) sia I = ltPictu-reEntryp ArtistEntry agt isin Istanze(ILikeEntry) | a isin Istanze(IArtistEntry)

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

21 Tecnologie in uso 4

Tabella 21 Parametri accettati da un metodo remoto

Request Message Class La classe del messaggio di richiesta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Response Message Class La classe del messaggio di risposta delGoogle Protocol RPC da utilizzare nellachiamata al metodo

Name Nome alternativo al metodoPath Il percorso URI da usare per accedere al

metodoHttp method Il metodo HTTP da usare (GET POST

ecc)

messaggi (ProtoRPC Messages) La Tabella 21 mostra i parametri accettati daimetodi remotiDopo aver completato la creazione dei vari metodi egrave possibile auto-generare lelibrerie per il client e quindi da importare nellrsquoapplicazione mobile Nel caso diArt Everywhere le librerie sono scritte in Java dato che si egrave scelto di realizzareunrsquoapplicazione Android Per autogenerare le librerie per il client egrave necessario usareil seguente comando da linea di comando

google_appengineendpointscfgpy ltcommandgt lttarget_langgt ltoptionsgt[class-name]

bull ltcommandgt puograve essere get_client_lib o get_discovery_doc

bull lttarget_langgt (usato solo con get_client_lib) specifica il tipo di pacchettoche si desidera creare Si egrave tenuti ad inserire il valore java per i client Javacome Android

bull ltoptiongt se fornito indica una o piugrave opzioni disponibili Ad esempio build-system specifica il tipo di bundle da produrre Si egrave tenuti a specificare gradleper i client Android

bull [class name] egrave il nome completo della classe

213 Google Cloud Datastore

Google Cloud Datastore3 (GCD) fornisce lrsquoarchiviazione dei dati senza richiedereuno schema fisso (NoSQL) garantendo una memorizzazione robusta e scalabile perle applicazioniA differenza dei tradizionali database relazionali GCD utilizza unrsquoarchitetturadistribuita per gestire automaticamente la scalabilitagrave fino a grandi insiemi di datiPoicheacute tutte le query sono servite da indici predefiniti i tipi di query che possonoessere eseguite sono piugrave restrittive rispetto a quelle consentite su un databaserelazionale con SQL In particolare non sono supportate le seguenti operazioni

3httpscloudgooglecomdatastoredocsconceptsoverview

21 Tecnologie in uso 5

join disuguaglianza di filtraggio su piugrave proprietagrave filtraggio dei dati sulla base deirisultati di una subqueryGCD salva gli oggetti di dati come entitagrave Unrsquoentitagrave ha una o piugrave proprietagrave icui valori possono essere uno dei diversi tipi di dati supportati per esempio unaproprietagrave puograve essere una stringa un numero intero o un riferimento ad unrsquoaltraentitagrave Ogni entitagrave egrave identificato dal suo genere che categorizza lrsquoentitagrave al fine dipoter effettuare query e una chiave che la identifica in modo univoco allrsquointerno delsuo genere

In Art Everywhere abbiamo utilizzato Python NDB Datastore API per po-ter definire modelli allrsquointerno di unrsquoapplicazione App Engine Un modello egrave unaclasse Python che agisce come una sorta di schema di database descrive un tipo didati in termini di proprietagrave

Nel capitolo 3 verragrave approfondita lrsquoanalisi concettuale del progetto che porteragrave alladefinizione del modello della base di dati utilizzata

214 Picasa Web Albums Data API

Le API di Picasa Web Albums consentono a siti web e applicazioni mobili di integrarsicon Picasa un software grafico per organizzare e modificare fotografie digitali evideo e di condividerle con altri utenti nei ldquoweb albumrdquoArt Everywhere memorizza tutte le immagini caricate dagli utenti su Picasa WebAlbums Usando lrsquoaccount Google dellrsquoapplicazione tutte le immagini (inviate daldispositivo mobile) vengono memorizzate dal backend in un web album chiamatoldquoArt Everywhererdquo e accessibile a chiunque tramite URL Tali URL vengono memo-rizzate nel database come una proprietagrave (url) della entitagrave PictureEntryDa App Engine lrsquoupload delle immagini su Picasa Web Album viene effettuatousando la libreria Google Data Python

215 Android

Android4 egrave un sistema operativo per dispositivi mobili sviluppato da Google Incbasato su kernel Linux e distribuito sotto i termini della licenza Apache 20 checonsente di modificare e distribuire liberamente il codice sorgentePer lo sviluppo di Art Everywhere egrave stato utilizzato Android Studio lrsquoIDE ufficialeper lo sviluppo di applicazioni Android basato su IntelliJ Idea e si egrave scelto di renderedisponibile lrsquoapplicazione a partire dalla versione sdk 15+ ovvero compatibile apartire dalla versione Android 40 (Ice Cream Sandwich)

216 Python

Python5 egrave un linguaggio di programmazione orientato agli oggetti e utilizzabile permolti tipi di sviluppo software Ersquo stato utilizzato per la realizzazione del backenddi Art Everyhwere sottoforma di una Python web app che interagisce con il web

4httpsitwikipediaorgwikiAndroid5httpswwwpythonorg

21 Tecnologie in uso 6

server GAE usando il protocollo WSGI6 In particolare egrave stato utilizzato webapp2un framework WSGI compatibile che consente di creare rapidamente sempliciapplicazioni web per il runtime di Python 27 Infatti la Python web app vieneeseguita da GAE utilizzando il linguaggio pre-caricato Python in un ambiente sicurosandbox Si tratta di un ambiente Python puro lrsquointerprete Python puograve eseguirequalsiasi codice Python ma non puograve caricare moduli Python che contengono codiceC

Inoltre in Art Everywhere il linguaggio di programmazione Python egrave statoutilizzato per codificare lrsquoalgoritmo di pattern recognition utilizzando la libreriaOpenCV (2110) il framework web Flask (218) e caricando il codice sul servizio dihosting PythonAnywhere (219)

217 OAuth 20

OAuth 20 egrave un protocollo aperto che garantisce ai service provider lrsquoaccesso daparte di terzi ai dati degli utenti proteggendo contemporanemente le loro credenzialiErsquo utilizzato dalle API di Google (ad esempio effettuare il login usando lrsquoaccountGoogle) per lrsquoautenticazione e le autorizzazioni e tutte le applicazioni seguono unpattern quando si accede ad un API di Google usando OAuth 20

bull ottenere le credenziali dalla Google Developer Console7 cioegrave il clientID e client secret che sono noti solamente a Google e alla propria applicazione

bull ottenere un token di accesso dal Server delle Autorizzazioni di Goo-gle prima che lrsquoapplicazione possa accedere ai dati privati tramite un API diGoogle si deve ottenere un token di accesso che concede lrsquoaccesso a tale APIUn parametro variabile di nome scope controlla lrsquoinsieme di risorse e delle ope-razioni che un token di accesso permette Se lrsquoutente concede lrsquoautorizzazioneil Server delle Autorizzazioni Google invia allrsquoapplicazione un token di accessoSe lrsquoutente non concede lrsquoautorizzazione il server restituisce un errore

bull inviare token di accesso ad uno specifico API in un header HTTP diautorizzazione

bull aggiornare il token di accesso se necessario poichegrave hanno una duratalimitata

218 Flask

Flask8 egrave un framework web scritto in Python e basato sullo strumento Werkzeug(libreria di utilitagrave HTTP e WSGI per Python) e con il motore template Jinja2 Flaskviene chiamato microframework percheacute non forza uno sviluppatore ad utilizzare un

6httpsitwikipediaorgwikiWeb_Server_Gateway_Interface Il Web Server Gateway In-terface (WSGI) egrave un protocollo di trasmissione che stabilisce e descrive comunicazioni ed interazionitra server ed applicazioni web scritte nel linguaggio Python Egrave quindi lrsquointerfaccia standard del webservice per la programmazione in Python

7httpsconsoledevelopersgooglecom8httpflaskpocooorgdocs010

22 Tecnologie abbandonate 7

particolare strumento o una libreria Non ha alcun livello di astrazione del databasela validazione dei form o qualsiasi altro componente in cui librerie di terze partipre-esistenti forniscono funzioni comuniIn Art Everywhere Flask egrave stato usato per realizzare unrsquoapplicazione web contenentelrsquoalgoritmo di pattern recognition per la similaritagrave tra immagini (53) e permetterecosigrave richieste RESTful effettuate dal backend

219 PythonAnywhere

PythonAnywhere9 egrave un servizio di hosting Web basato sul linguaggio di program-mazione Python Le applicazioni web ospitate possono essere scritte utilizzandoqualsiasi applicazione basata su framework WSGI con Art Everywhere abbiamoutilizzato Flask

2110 OpenCV

OpenCV10 egrave una libreria open source per software di computer vision e machinelearning OpenCV egrave stato realizzato per fornire una infrastruttura comune perapplicazioni di computer vision La libreria dispone metodi che possono essereutilizzati per rilevare e riconoscere i volti umani identificare oggetti classificare leazioni umane nei video tracciare movimenti di macchine su pista estrarre modelli3D di oggetti seguire i movimenti degli occhi riconoscere scenari eccDispone di interfacce C++ C Python Java e MATLAB e supporta WindowsLinux Android e Mac OS

In Art Everywhere tale libreria egrave stata utilizzata per realizzare lrsquoalgoritmodi pattern recognition per la similaritagrave tra immagini (53) utilizzando lrsquointerfacciaPython in ambiente Linux

22 Tecnologie abbandonate

221 Google BlobStore API

BlobStore API11 consente alle applicazioni di servire oggetti di dati chiamati blobche sono molto piugrave grandi della dimensione consentita per oggetti nel servizioDatastore come ad esempio i file video o immagini Blobs sono creati caricandoun file tramite una richiesta HTTP e cosigrave Blobstore crea un blob dal contenuto delfile e restituisce un riferimento per il blob chiamato blob key che potragrave poi essereutilizzato per servire il blobQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Per poter scrivere un blob direttamente sul Datastore egrave necessario lrsquoutilizzodi una low-level API messa a disposizione da Google Files API Essa perograve

9httpswwwpythonanywherecom10httpopencvorg11httpscloudgooglecomappenginedocsjavablobstore

23 Metodologia utilizzata ed organizzazione del lavoro 8

egrave stata deprecata da Google12 in favore dellrsquoutilizzo del solo Google CloudStorage il quale offre un servizio di scrittura file-like similare

bull Google Cloud Datastore offre uno spazio di archiviazione limitato per lrsquoarchi-viazione dei blobs (5GB di spazio free) che si sarebbe saturato facilmente seavessimo scelto di caricare le immagini direttamente su di esso

222 Google Cloud Storage

Google Cloud Storage13 egrave un servizio Internet per memorizzare i dati nel cloud diGoogleQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Spazio di archiviazione free inferiore rispetto a quello offerto da Picasa (5GBdi spazio offerti da GCS contro i 15GB di spazio gratuito offerti da GoogleDrive e di conseguenza messi a disposizione per Picasa)

bull Maggiore efficienza nellrsquoupload riscontrata nei test effettuati

23 Metodologia utilizzata ed organizzazione del lavoro

231 Milestones

Il workshop Google Technologies for Cloud and Web Development nel quale egrave statorealizzato il progetto Art Everywhere ha previsto delle milestones intermedieovvero dei momenti di verifica del progetto nei quali egrave stato presentato lo stato diavanzamento del lavoro ed egrave stato valutato dallo staff e dai mentors del workshop

Per la prima milestone (Gennaio 2015) ci siamo concentrati sullo studiodelle tecnologie utilizzate per sviluppare un Minimum Viable Product con lo scopodi presentare e testare le principali caratteristiche dellrsquoapplicazione In particolareabbiamo sviluppato lrsquoUpload delle immagini e la Galleria principale usata permostrare le opere caricate dagli artisti

Per la seconda milestone (Febbraio 2015) ci siamo focalizzati sui feedbackricevuti nella precedente e sui bisogni dei nostri utenti (gli artisti) sottoponendo unsondaggio a piugrave di 50 artisti Sono state aggiunte altre caratteristiche come la Paginadellrsquoartista il Dettaglio opera e i Filtri di ricerca opere La Release Candidate egravestata testata da 10 utenti I risultati dei sondaggi sono stati presentati nel Capitolo 6

Lo scopo della terza milestone (Marzo 2015) era quello di presentare lrsquointe-ro progetto funzionante Lrsquoapplicazione egrave stata completata realizzando la partesocial (Likes Commenti e Condivisione) migliorando lrsquoUser Interface adottando ilMaterial Design e lrsquousabilitagrave dellrsquoapplicazione attraverso dei sondaggi condotti suun campione di utenti

12httpscloudgooglecomappenginedocspythongooglestorage13httpscloudgooglecomstoragedocsoverview

23 Metodologia utilizzata ed organizzazione del lavoro 9

La quarta milestone (Aprile 2015) rappresentava la Final Submission ovve-ro la presentazione del progetto davanti ad una giuria composta oltre che dallostaff del workshop da ingegneri Google Allrsquoapplicazione sono state aggiunte lapossibilitagrave di modificareeliminare unrsquoopera drsquoarte modificareaggiornare il profilodellrsquoartista segnalare un commento o unrsquoopera offensiva e visualizzare la lista dellepersone che hanno messo un Like ad unrsquoopera

232 Divisione del lavoro

Il progetto egrave stato realizzato come lavoro di gruppo durante il workshop GoogleTechnologies for Cloud and Web Development e la suddivisione del lavoro egrave derivatadallrsquoarchitettura three-tier usata come riferimento ovvero interfaccia utente logicafunzionale (business logic) e gestione dei dati persistenti Ciascuno ha poi svi-luppato una o piugrave funzionalitagrave che ha approfondito nella propria relazione al progetto

Il mio personale contributo che viene presentato in queste pagine ha ri-guardato gli algoritmi usati per il trasferimento (uploaddownload) efficiente delleopere drsquoarte ovvero di immagini e per la loro compressione prevenendo unaperdita significativa della qualitagrave Inoltre viene presentato il sistema realizzatoper il riconoscimento di pattern finalizzato ad individuare similaritagrave tra le operedrsquoarte presenti nel database e con opere drsquoarte famose in modo da individuare falsidrsquoautore e prevenire eventuali furti di proprietagrave intellettuale

233 Tool utilizzati

Per coordinare il lavoro abbiamo utilizzato GitHub14 un servizio web di hosting perlo sviluppo di progetti software che ci ha permesso di creare una repository15 perpoter condividere il codice del progetto e lavorare cosigrave simultaneamente Inoltreabbiamo ritenuto molto utile la funzione Issues che rappresenta un ottimo modoper tenere traccia delle attivitagrave miglioramenti e bug del progetto

Abbiamo effettuato revisioni continue circa ogni 23 giorni con lo scopo diverificare lrsquoavanzamento del lavoro in base alle milestones fissate Ciograve egrave avvenutotramite incontri fisici o tramite il servizio di messaggistica istantanea e VoIPHangout16 Google Drive17 egrave stato utilizzato per lrsquoarchiviazione e lo scambio didocumenti condivisi come ad esempio immagini documentazioni diagrammidellrsquoarchitettura e di progettazioneecc Survio18 egrave un software online per crearegratuitamente questionari e sondaggi ed egrave cosigrave stato utilizzato per sottoporre iquestionari presentati nel Capitolo 6 Infine abbiamo utilizzato Android Studio19lrsquoIDE ufficiale per lo sviluppo di applicazioni Android e PyCharm20un ambiente disviluppo per la programmazione Python

14httpsgithubcom15httpsgithubcomdavideaurucciArtEverywhere16httpwwwgooglecom+learnmorehangouts17httpdrivegooglecom18httpwwwsurviocomit19httpsdeveloperandroidcomsdkindexhtml20httpswwwjetbrainscompycharm

10

Capitolo 3

Analisi concettuale del sistema

In questo capitolo viene approfondita la conoscenza del dominio di interesse inmaniera tale da poter descrivere in modo preciso e completo cosa tale progettodeve realizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

31 Modello Entitagrave-Relazioni

LikeEntry

PictureEntryArtistEntry

FlagEntry

TechniqueEntry

CommentEntry

BlacklistEntry

CommentFlag PictureFlag FlaggedPicture

FlaggedComment

PictureParent

CommentBy CommentParent

PictureTechnique

Figura 31 Schema ER dellrsquoapplicazione

311 Vincoli non esprimibili nello schema

Non sono esprimibili nello schema i seguenti vincoli esterni

bull Vincolo sul numero segnalazioni di Visitor forall v isin Istanze(IVisitor)esiste al piugrave un fd isin Istanze(IFlagged) con fd = ltUserv FlagEntryfgt

bull Vincolo sullrsquoattributo likes forall p isin Istanze(IPictureEntry) sia I = ltPictu-reEntryp ArtistEntry agt isin Istanze(ILikeEntry) | a isin Istanze(IArtistEntry)

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

21 Tecnologie in uso 5

join disuguaglianza di filtraggio su piugrave proprietagrave filtraggio dei dati sulla base deirisultati di una subqueryGCD salva gli oggetti di dati come entitagrave Unrsquoentitagrave ha una o piugrave proprietagrave icui valori possono essere uno dei diversi tipi di dati supportati per esempio unaproprietagrave puograve essere una stringa un numero intero o un riferimento ad unrsquoaltraentitagrave Ogni entitagrave egrave identificato dal suo genere che categorizza lrsquoentitagrave al fine dipoter effettuare query e una chiave che la identifica in modo univoco allrsquointerno delsuo genere

In Art Everywhere abbiamo utilizzato Python NDB Datastore API per po-ter definire modelli allrsquointerno di unrsquoapplicazione App Engine Un modello egrave unaclasse Python che agisce come una sorta di schema di database descrive un tipo didati in termini di proprietagrave

Nel capitolo 3 verragrave approfondita lrsquoanalisi concettuale del progetto che porteragrave alladefinizione del modello della base di dati utilizzata

214 Picasa Web Albums Data API

Le API di Picasa Web Albums consentono a siti web e applicazioni mobili di integrarsicon Picasa un software grafico per organizzare e modificare fotografie digitali evideo e di condividerle con altri utenti nei ldquoweb albumrdquoArt Everywhere memorizza tutte le immagini caricate dagli utenti su Picasa WebAlbums Usando lrsquoaccount Google dellrsquoapplicazione tutte le immagini (inviate daldispositivo mobile) vengono memorizzate dal backend in un web album chiamatoldquoArt Everywhererdquo e accessibile a chiunque tramite URL Tali URL vengono memo-rizzate nel database come una proprietagrave (url) della entitagrave PictureEntryDa App Engine lrsquoupload delle immagini su Picasa Web Album viene effettuatousando la libreria Google Data Python

215 Android

Android4 egrave un sistema operativo per dispositivi mobili sviluppato da Google Incbasato su kernel Linux e distribuito sotto i termini della licenza Apache 20 checonsente di modificare e distribuire liberamente il codice sorgentePer lo sviluppo di Art Everywhere egrave stato utilizzato Android Studio lrsquoIDE ufficialeper lo sviluppo di applicazioni Android basato su IntelliJ Idea e si egrave scelto di renderedisponibile lrsquoapplicazione a partire dalla versione sdk 15+ ovvero compatibile apartire dalla versione Android 40 (Ice Cream Sandwich)

216 Python

Python5 egrave un linguaggio di programmazione orientato agli oggetti e utilizzabile permolti tipi di sviluppo software Ersquo stato utilizzato per la realizzazione del backenddi Art Everyhwere sottoforma di una Python web app che interagisce con il web

4httpsitwikipediaorgwikiAndroid5httpswwwpythonorg

21 Tecnologie in uso 6

server GAE usando il protocollo WSGI6 In particolare egrave stato utilizzato webapp2un framework WSGI compatibile che consente di creare rapidamente sempliciapplicazioni web per il runtime di Python 27 Infatti la Python web app vieneeseguita da GAE utilizzando il linguaggio pre-caricato Python in un ambiente sicurosandbox Si tratta di un ambiente Python puro lrsquointerprete Python puograve eseguirequalsiasi codice Python ma non puograve caricare moduli Python che contengono codiceC

Inoltre in Art Everywhere il linguaggio di programmazione Python egrave statoutilizzato per codificare lrsquoalgoritmo di pattern recognition utilizzando la libreriaOpenCV (2110) il framework web Flask (218) e caricando il codice sul servizio dihosting PythonAnywhere (219)

217 OAuth 20

OAuth 20 egrave un protocollo aperto che garantisce ai service provider lrsquoaccesso daparte di terzi ai dati degli utenti proteggendo contemporanemente le loro credenzialiErsquo utilizzato dalle API di Google (ad esempio effettuare il login usando lrsquoaccountGoogle) per lrsquoautenticazione e le autorizzazioni e tutte le applicazioni seguono unpattern quando si accede ad un API di Google usando OAuth 20

bull ottenere le credenziali dalla Google Developer Console7 cioegrave il clientID e client secret che sono noti solamente a Google e alla propria applicazione

bull ottenere un token di accesso dal Server delle Autorizzazioni di Goo-gle prima che lrsquoapplicazione possa accedere ai dati privati tramite un API diGoogle si deve ottenere un token di accesso che concede lrsquoaccesso a tale APIUn parametro variabile di nome scope controlla lrsquoinsieme di risorse e delle ope-razioni che un token di accesso permette Se lrsquoutente concede lrsquoautorizzazioneil Server delle Autorizzazioni Google invia allrsquoapplicazione un token di accessoSe lrsquoutente non concede lrsquoautorizzazione il server restituisce un errore

bull inviare token di accesso ad uno specifico API in un header HTTP diautorizzazione

bull aggiornare il token di accesso se necessario poichegrave hanno una duratalimitata

218 Flask

Flask8 egrave un framework web scritto in Python e basato sullo strumento Werkzeug(libreria di utilitagrave HTTP e WSGI per Python) e con il motore template Jinja2 Flaskviene chiamato microframework percheacute non forza uno sviluppatore ad utilizzare un

6httpsitwikipediaorgwikiWeb_Server_Gateway_Interface Il Web Server Gateway In-terface (WSGI) egrave un protocollo di trasmissione che stabilisce e descrive comunicazioni ed interazionitra server ed applicazioni web scritte nel linguaggio Python Egrave quindi lrsquointerfaccia standard del webservice per la programmazione in Python

7httpsconsoledevelopersgooglecom8httpflaskpocooorgdocs010

22 Tecnologie abbandonate 7

particolare strumento o una libreria Non ha alcun livello di astrazione del databasela validazione dei form o qualsiasi altro componente in cui librerie di terze partipre-esistenti forniscono funzioni comuniIn Art Everywhere Flask egrave stato usato per realizzare unrsquoapplicazione web contenentelrsquoalgoritmo di pattern recognition per la similaritagrave tra immagini (53) e permetterecosigrave richieste RESTful effettuate dal backend

219 PythonAnywhere

PythonAnywhere9 egrave un servizio di hosting Web basato sul linguaggio di program-mazione Python Le applicazioni web ospitate possono essere scritte utilizzandoqualsiasi applicazione basata su framework WSGI con Art Everywhere abbiamoutilizzato Flask

2110 OpenCV

OpenCV10 egrave una libreria open source per software di computer vision e machinelearning OpenCV egrave stato realizzato per fornire una infrastruttura comune perapplicazioni di computer vision La libreria dispone metodi che possono essereutilizzati per rilevare e riconoscere i volti umani identificare oggetti classificare leazioni umane nei video tracciare movimenti di macchine su pista estrarre modelli3D di oggetti seguire i movimenti degli occhi riconoscere scenari eccDispone di interfacce C++ C Python Java e MATLAB e supporta WindowsLinux Android e Mac OS

In Art Everywhere tale libreria egrave stata utilizzata per realizzare lrsquoalgoritmodi pattern recognition per la similaritagrave tra immagini (53) utilizzando lrsquointerfacciaPython in ambiente Linux

22 Tecnologie abbandonate

221 Google BlobStore API

BlobStore API11 consente alle applicazioni di servire oggetti di dati chiamati blobche sono molto piugrave grandi della dimensione consentita per oggetti nel servizioDatastore come ad esempio i file video o immagini Blobs sono creati caricandoun file tramite una richiesta HTTP e cosigrave Blobstore crea un blob dal contenuto delfile e restituisce un riferimento per il blob chiamato blob key che potragrave poi essereutilizzato per servire il blobQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Per poter scrivere un blob direttamente sul Datastore egrave necessario lrsquoutilizzodi una low-level API messa a disposizione da Google Files API Essa perograve

9httpswwwpythonanywherecom10httpopencvorg11httpscloudgooglecomappenginedocsjavablobstore

23 Metodologia utilizzata ed organizzazione del lavoro 8

egrave stata deprecata da Google12 in favore dellrsquoutilizzo del solo Google CloudStorage il quale offre un servizio di scrittura file-like similare

bull Google Cloud Datastore offre uno spazio di archiviazione limitato per lrsquoarchi-viazione dei blobs (5GB di spazio free) che si sarebbe saturato facilmente seavessimo scelto di caricare le immagini direttamente su di esso

222 Google Cloud Storage

Google Cloud Storage13 egrave un servizio Internet per memorizzare i dati nel cloud diGoogleQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Spazio di archiviazione free inferiore rispetto a quello offerto da Picasa (5GBdi spazio offerti da GCS contro i 15GB di spazio gratuito offerti da GoogleDrive e di conseguenza messi a disposizione per Picasa)

bull Maggiore efficienza nellrsquoupload riscontrata nei test effettuati

23 Metodologia utilizzata ed organizzazione del lavoro

231 Milestones

Il workshop Google Technologies for Cloud and Web Development nel quale egrave statorealizzato il progetto Art Everywhere ha previsto delle milestones intermedieovvero dei momenti di verifica del progetto nei quali egrave stato presentato lo stato diavanzamento del lavoro ed egrave stato valutato dallo staff e dai mentors del workshop

Per la prima milestone (Gennaio 2015) ci siamo concentrati sullo studiodelle tecnologie utilizzate per sviluppare un Minimum Viable Product con lo scopodi presentare e testare le principali caratteristiche dellrsquoapplicazione In particolareabbiamo sviluppato lrsquoUpload delle immagini e la Galleria principale usata permostrare le opere caricate dagli artisti

Per la seconda milestone (Febbraio 2015) ci siamo focalizzati sui feedbackricevuti nella precedente e sui bisogni dei nostri utenti (gli artisti) sottoponendo unsondaggio a piugrave di 50 artisti Sono state aggiunte altre caratteristiche come la Paginadellrsquoartista il Dettaglio opera e i Filtri di ricerca opere La Release Candidate egravestata testata da 10 utenti I risultati dei sondaggi sono stati presentati nel Capitolo 6

Lo scopo della terza milestone (Marzo 2015) era quello di presentare lrsquointe-ro progetto funzionante Lrsquoapplicazione egrave stata completata realizzando la partesocial (Likes Commenti e Condivisione) migliorando lrsquoUser Interface adottando ilMaterial Design e lrsquousabilitagrave dellrsquoapplicazione attraverso dei sondaggi condotti suun campione di utenti

12httpscloudgooglecomappenginedocspythongooglestorage13httpscloudgooglecomstoragedocsoverview

23 Metodologia utilizzata ed organizzazione del lavoro 9

La quarta milestone (Aprile 2015) rappresentava la Final Submission ovve-ro la presentazione del progetto davanti ad una giuria composta oltre che dallostaff del workshop da ingegneri Google Allrsquoapplicazione sono state aggiunte lapossibilitagrave di modificareeliminare unrsquoopera drsquoarte modificareaggiornare il profilodellrsquoartista segnalare un commento o unrsquoopera offensiva e visualizzare la lista dellepersone che hanno messo un Like ad unrsquoopera

232 Divisione del lavoro

Il progetto egrave stato realizzato come lavoro di gruppo durante il workshop GoogleTechnologies for Cloud and Web Development e la suddivisione del lavoro egrave derivatadallrsquoarchitettura three-tier usata come riferimento ovvero interfaccia utente logicafunzionale (business logic) e gestione dei dati persistenti Ciascuno ha poi svi-luppato una o piugrave funzionalitagrave che ha approfondito nella propria relazione al progetto

Il mio personale contributo che viene presentato in queste pagine ha ri-guardato gli algoritmi usati per il trasferimento (uploaddownload) efficiente delleopere drsquoarte ovvero di immagini e per la loro compressione prevenendo unaperdita significativa della qualitagrave Inoltre viene presentato il sistema realizzatoper il riconoscimento di pattern finalizzato ad individuare similaritagrave tra le operedrsquoarte presenti nel database e con opere drsquoarte famose in modo da individuare falsidrsquoautore e prevenire eventuali furti di proprietagrave intellettuale

233 Tool utilizzati

Per coordinare il lavoro abbiamo utilizzato GitHub14 un servizio web di hosting perlo sviluppo di progetti software che ci ha permesso di creare una repository15 perpoter condividere il codice del progetto e lavorare cosigrave simultaneamente Inoltreabbiamo ritenuto molto utile la funzione Issues che rappresenta un ottimo modoper tenere traccia delle attivitagrave miglioramenti e bug del progetto

Abbiamo effettuato revisioni continue circa ogni 23 giorni con lo scopo diverificare lrsquoavanzamento del lavoro in base alle milestones fissate Ciograve egrave avvenutotramite incontri fisici o tramite il servizio di messaggistica istantanea e VoIPHangout16 Google Drive17 egrave stato utilizzato per lrsquoarchiviazione e lo scambio didocumenti condivisi come ad esempio immagini documentazioni diagrammidellrsquoarchitettura e di progettazioneecc Survio18 egrave un software online per crearegratuitamente questionari e sondaggi ed egrave cosigrave stato utilizzato per sottoporre iquestionari presentati nel Capitolo 6 Infine abbiamo utilizzato Android Studio19lrsquoIDE ufficiale per lo sviluppo di applicazioni Android e PyCharm20un ambiente disviluppo per la programmazione Python

14httpsgithubcom15httpsgithubcomdavideaurucciArtEverywhere16httpwwwgooglecom+learnmorehangouts17httpdrivegooglecom18httpwwwsurviocomit19httpsdeveloperandroidcomsdkindexhtml20httpswwwjetbrainscompycharm

10

Capitolo 3

Analisi concettuale del sistema

In questo capitolo viene approfondita la conoscenza del dominio di interesse inmaniera tale da poter descrivere in modo preciso e completo cosa tale progettodeve realizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

31 Modello Entitagrave-Relazioni

LikeEntry

PictureEntryArtistEntry

FlagEntry

TechniqueEntry

CommentEntry

BlacklistEntry

CommentFlag PictureFlag FlaggedPicture

FlaggedComment

PictureParent

CommentBy CommentParent

PictureTechnique

Figura 31 Schema ER dellrsquoapplicazione

311 Vincoli non esprimibili nello schema

Non sono esprimibili nello schema i seguenti vincoli esterni

bull Vincolo sul numero segnalazioni di Visitor forall v isin Istanze(IVisitor)esiste al piugrave un fd isin Istanze(IFlagged) con fd = ltUserv FlagEntryfgt

bull Vincolo sullrsquoattributo likes forall p isin Istanze(IPictureEntry) sia I = ltPictu-reEntryp ArtistEntry agt isin Istanze(ILikeEntry) | a isin Istanze(IArtistEntry)

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

21 Tecnologie in uso 6

server GAE usando il protocollo WSGI6 In particolare egrave stato utilizzato webapp2un framework WSGI compatibile che consente di creare rapidamente sempliciapplicazioni web per il runtime di Python 27 Infatti la Python web app vieneeseguita da GAE utilizzando il linguaggio pre-caricato Python in un ambiente sicurosandbox Si tratta di un ambiente Python puro lrsquointerprete Python puograve eseguirequalsiasi codice Python ma non puograve caricare moduli Python che contengono codiceC

Inoltre in Art Everywhere il linguaggio di programmazione Python egrave statoutilizzato per codificare lrsquoalgoritmo di pattern recognition utilizzando la libreriaOpenCV (2110) il framework web Flask (218) e caricando il codice sul servizio dihosting PythonAnywhere (219)

217 OAuth 20

OAuth 20 egrave un protocollo aperto che garantisce ai service provider lrsquoaccesso daparte di terzi ai dati degli utenti proteggendo contemporanemente le loro credenzialiErsquo utilizzato dalle API di Google (ad esempio effettuare il login usando lrsquoaccountGoogle) per lrsquoautenticazione e le autorizzazioni e tutte le applicazioni seguono unpattern quando si accede ad un API di Google usando OAuth 20

bull ottenere le credenziali dalla Google Developer Console7 cioegrave il clientID e client secret che sono noti solamente a Google e alla propria applicazione

bull ottenere un token di accesso dal Server delle Autorizzazioni di Goo-gle prima che lrsquoapplicazione possa accedere ai dati privati tramite un API diGoogle si deve ottenere un token di accesso che concede lrsquoaccesso a tale APIUn parametro variabile di nome scope controlla lrsquoinsieme di risorse e delle ope-razioni che un token di accesso permette Se lrsquoutente concede lrsquoautorizzazioneil Server delle Autorizzazioni Google invia allrsquoapplicazione un token di accessoSe lrsquoutente non concede lrsquoautorizzazione il server restituisce un errore

bull inviare token di accesso ad uno specifico API in un header HTTP diautorizzazione

bull aggiornare il token di accesso se necessario poichegrave hanno una duratalimitata

218 Flask

Flask8 egrave un framework web scritto in Python e basato sullo strumento Werkzeug(libreria di utilitagrave HTTP e WSGI per Python) e con il motore template Jinja2 Flaskviene chiamato microframework percheacute non forza uno sviluppatore ad utilizzare un

6httpsitwikipediaorgwikiWeb_Server_Gateway_Interface Il Web Server Gateway In-terface (WSGI) egrave un protocollo di trasmissione che stabilisce e descrive comunicazioni ed interazionitra server ed applicazioni web scritte nel linguaggio Python Egrave quindi lrsquointerfaccia standard del webservice per la programmazione in Python

7httpsconsoledevelopersgooglecom8httpflaskpocooorgdocs010

22 Tecnologie abbandonate 7

particolare strumento o una libreria Non ha alcun livello di astrazione del databasela validazione dei form o qualsiasi altro componente in cui librerie di terze partipre-esistenti forniscono funzioni comuniIn Art Everywhere Flask egrave stato usato per realizzare unrsquoapplicazione web contenentelrsquoalgoritmo di pattern recognition per la similaritagrave tra immagini (53) e permetterecosigrave richieste RESTful effettuate dal backend

219 PythonAnywhere

PythonAnywhere9 egrave un servizio di hosting Web basato sul linguaggio di program-mazione Python Le applicazioni web ospitate possono essere scritte utilizzandoqualsiasi applicazione basata su framework WSGI con Art Everywhere abbiamoutilizzato Flask

2110 OpenCV

OpenCV10 egrave una libreria open source per software di computer vision e machinelearning OpenCV egrave stato realizzato per fornire una infrastruttura comune perapplicazioni di computer vision La libreria dispone metodi che possono essereutilizzati per rilevare e riconoscere i volti umani identificare oggetti classificare leazioni umane nei video tracciare movimenti di macchine su pista estrarre modelli3D di oggetti seguire i movimenti degli occhi riconoscere scenari eccDispone di interfacce C++ C Python Java e MATLAB e supporta WindowsLinux Android e Mac OS

In Art Everywhere tale libreria egrave stata utilizzata per realizzare lrsquoalgoritmodi pattern recognition per la similaritagrave tra immagini (53) utilizzando lrsquointerfacciaPython in ambiente Linux

22 Tecnologie abbandonate

221 Google BlobStore API

BlobStore API11 consente alle applicazioni di servire oggetti di dati chiamati blobche sono molto piugrave grandi della dimensione consentita per oggetti nel servizioDatastore come ad esempio i file video o immagini Blobs sono creati caricandoun file tramite una richiesta HTTP e cosigrave Blobstore crea un blob dal contenuto delfile e restituisce un riferimento per il blob chiamato blob key che potragrave poi essereutilizzato per servire il blobQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Per poter scrivere un blob direttamente sul Datastore egrave necessario lrsquoutilizzodi una low-level API messa a disposizione da Google Files API Essa perograve

9httpswwwpythonanywherecom10httpopencvorg11httpscloudgooglecomappenginedocsjavablobstore

23 Metodologia utilizzata ed organizzazione del lavoro 8

egrave stata deprecata da Google12 in favore dellrsquoutilizzo del solo Google CloudStorage il quale offre un servizio di scrittura file-like similare

bull Google Cloud Datastore offre uno spazio di archiviazione limitato per lrsquoarchi-viazione dei blobs (5GB di spazio free) che si sarebbe saturato facilmente seavessimo scelto di caricare le immagini direttamente su di esso

222 Google Cloud Storage

Google Cloud Storage13 egrave un servizio Internet per memorizzare i dati nel cloud diGoogleQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Spazio di archiviazione free inferiore rispetto a quello offerto da Picasa (5GBdi spazio offerti da GCS contro i 15GB di spazio gratuito offerti da GoogleDrive e di conseguenza messi a disposizione per Picasa)

bull Maggiore efficienza nellrsquoupload riscontrata nei test effettuati

23 Metodologia utilizzata ed organizzazione del lavoro

231 Milestones

Il workshop Google Technologies for Cloud and Web Development nel quale egrave statorealizzato il progetto Art Everywhere ha previsto delle milestones intermedieovvero dei momenti di verifica del progetto nei quali egrave stato presentato lo stato diavanzamento del lavoro ed egrave stato valutato dallo staff e dai mentors del workshop

Per la prima milestone (Gennaio 2015) ci siamo concentrati sullo studiodelle tecnologie utilizzate per sviluppare un Minimum Viable Product con lo scopodi presentare e testare le principali caratteristiche dellrsquoapplicazione In particolareabbiamo sviluppato lrsquoUpload delle immagini e la Galleria principale usata permostrare le opere caricate dagli artisti

Per la seconda milestone (Febbraio 2015) ci siamo focalizzati sui feedbackricevuti nella precedente e sui bisogni dei nostri utenti (gli artisti) sottoponendo unsondaggio a piugrave di 50 artisti Sono state aggiunte altre caratteristiche come la Paginadellrsquoartista il Dettaglio opera e i Filtri di ricerca opere La Release Candidate egravestata testata da 10 utenti I risultati dei sondaggi sono stati presentati nel Capitolo 6

Lo scopo della terza milestone (Marzo 2015) era quello di presentare lrsquointe-ro progetto funzionante Lrsquoapplicazione egrave stata completata realizzando la partesocial (Likes Commenti e Condivisione) migliorando lrsquoUser Interface adottando ilMaterial Design e lrsquousabilitagrave dellrsquoapplicazione attraverso dei sondaggi condotti suun campione di utenti

12httpscloudgooglecomappenginedocspythongooglestorage13httpscloudgooglecomstoragedocsoverview

23 Metodologia utilizzata ed organizzazione del lavoro 9

La quarta milestone (Aprile 2015) rappresentava la Final Submission ovve-ro la presentazione del progetto davanti ad una giuria composta oltre che dallostaff del workshop da ingegneri Google Allrsquoapplicazione sono state aggiunte lapossibilitagrave di modificareeliminare unrsquoopera drsquoarte modificareaggiornare il profilodellrsquoartista segnalare un commento o unrsquoopera offensiva e visualizzare la lista dellepersone che hanno messo un Like ad unrsquoopera

232 Divisione del lavoro

Il progetto egrave stato realizzato come lavoro di gruppo durante il workshop GoogleTechnologies for Cloud and Web Development e la suddivisione del lavoro egrave derivatadallrsquoarchitettura three-tier usata come riferimento ovvero interfaccia utente logicafunzionale (business logic) e gestione dei dati persistenti Ciascuno ha poi svi-luppato una o piugrave funzionalitagrave che ha approfondito nella propria relazione al progetto

Il mio personale contributo che viene presentato in queste pagine ha ri-guardato gli algoritmi usati per il trasferimento (uploaddownload) efficiente delleopere drsquoarte ovvero di immagini e per la loro compressione prevenendo unaperdita significativa della qualitagrave Inoltre viene presentato il sistema realizzatoper il riconoscimento di pattern finalizzato ad individuare similaritagrave tra le operedrsquoarte presenti nel database e con opere drsquoarte famose in modo da individuare falsidrsquoautore e prevenire eventuali furti di proprietagrave intellettuale

233 Tool utilizzati

Per coordinare il lavoro abbiamo utilizzato GitHub14 un servizio web di hosting perlo sviluppo di progetti software che ci ha permesso di creare una repository15 perpoter condividere il codice del progetto e lavorare cosigrave simultaneamente Inoltreabbiamo ritenuto molto utile la funzione Issues che rappresenta un ottimo modoper tenere traccia delle attivitagrave miglioramenti e bug del progetto

Abbiamo effettuato revisioni continue circa ogni 23 giorni con lo scopo diverificare lrsquoavanzamento del lavoro in base alle milestones fissate Ciograve egrave avvenutotramite incontri fisici o tramite il servizio di messaggistica istantanea e VoIPHangout16 Google Drive17 egrave stato utilizzato per lrsquoarchiviazione e lo scambio didocumenti condivisi come ad esempio immagini documentazioni diagrammidellrsquoarchitettura e di progettazioneecc Survio18 egrave un software online per crearegratuitamente questionari e sondaggi ed egrave cosigrave stato utilizzato per sottoporre iquestionari presentati nel Capitolo 6 Infine abbiamo utilizzato Android Studio19lrsquoIDE ufficiale per lo sviluppo di applicazioni Android e PyCharm20un ambiente disviluppo per la programmazione Python

14httpsgithubcom15httpsgithubcomdavideaurucciArtEverywhere16httpwwwgooglecom+learnmorehangouts17httpdrivegooglecom18httpwwwsurviocomit19httpsdeveloperandroidcomsdkindexhtml20httpswwwjetbrainscompycharm

10

Capitolo 3

Analisi concettuale del sistema

In questo capitolo viene approfondita la conoscenza del dominio di interesse inmaniera tale da poter descrivere in modo preciso e completo cosa tale progettodeve realizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

31 Modello Entitagrave-Relazioni

LikeEntry

PictureEntryArtistEntry

FlagEntry

TechniqueEntry

CommentEntry

BlacklistEntry

CommentFlag PictureFlag FlaggedPicture

FlaggedComment

PictureParent

CommentBy CommentParent

PictureTechnique

Figura 31 Schema ER dellrsquoapplicazione

311 Vincoli non esprimibili nello schema

Non sono esprimibili nello schema i seguenti vincoli esterni

bull Vincolo sul numero segnalazioni di Visitor forall v isin Istanze(IVisitor)esiste al piugrave un fd isin Istanze(IFlagged) con fd = ltUserv FlagEntryfgt

bull Vincolo sullrsquoattributo likes forall p isin Istanze(IPictureEntry) sia I = ltPictu-reEntryp ArtistEntry agt isin Istanze(ILikeEntry) | a isin Istanze(IArtistEntry)

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

22 Tecnologie abbandonate 7

particolare strumento o una libreria Non ha alcun livello di astrazione del databasela validazione dei form o qualsiasi altro componente in cui librerie di terze partipre-esistenti forniscono funzioni comuniIn Art Everywhere Flask egrave stato usato per realizzare unrsquoapplicazione web contenentelrsquoalgoritmo di pattern recognition per la similaritagrave tra immagini (53) e permetterecosigrave richieste RESTful effettuate dal backend

219 PythonAnywhere

PythonAnywhere9 egrave un servizio di hosting Web basato sul linguaggio di program-mazione Python Le applicazioni web ospitate possono essere scritte utilizzandoqualsiasi applicazione basata su framework WSGI con Art Everywhere abbiamoutilizzato Flask

2110 OpenCV

OpenCV10 egrave una libreria open source per software di computer vision e machinelearning OpenCV egrave stato realizzato per fornire una infrastruttura comune perapplicazioni di computer vision La libreria dispone metodi che possono essereutilizzati per rilevare e riconoscere i volti umani identificare oggetti classificare leazioni umane nei video tracciare movimenti di macchine su pista estrarre modelli3D di oggetti seguire i movimenti degli occhi riconoscere scenari eccDispone di interfacce C++ C Python Java e MATLAB e supporta WindowsLinux Android e Mac OS

In Art Everywhere tale libreria egrave stata utilizzata per realizzare lrsquoalgoritmodi pattern recognition per la similaritagrave tra immagini (53) utilizzando lrsquointerfacciaPython in ambiente Linux

22 Tecnologie abbandonate

221 Google BlobStore API

BlobStore API11 consente alle applicazioni di servire oggetti di dati chiamati blobche sono molto piugrave grandi della dimensione consentita per oggetti nel servizioDatastore come ad esempio i file video o immagini Blobs sono creati caricandoun file tramite una richiesta HTTP e cosigrave Blobstore crea un blob dal contenuto delfile e restituisce un riferimento per il blob chiamato blob key che potragrave poi essereutilizzato per servire il blobQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Per poter scrivere un blob direttamente sul Datastore egrave necessario lrsquoutilizzodi una low-level API messa a disposizione da Google Files API Essa perograve

9httpswwwpythonanywherecom10httpopencvorg11httpscloudgooglecomappenginedocsjavablobstore

23 Metodologia utilizzata ed organizzazione del lavoro 8

egrave stata deprecata da Google12 in favore dellrsquoutilizzo del solo Google CloudStorage il quale offre un servizio di scrittura file-like similare

bull Google Cloud Datastore offre uno spazio di archiviazione limitato per lrsquoarchi-viazione dei blobs (5GB di spazio free) che si sarebbe saturato facilmente seavessimo scelto di caricare le immagini direttamente su di esso

222 Google Cloud Storage

Google Cloud Storage13 egrave un servizio Internet per memorizzare i dati nel cloud diGoogleQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Spazio di archiviazione free inferiore rispetto a quello offerto da Picasa (5GBdi spazio offerti da GCS contro i 15GB di spazio gratuito offerti da GoogleDrive e di conseguenza messi a disposizione per Picasa)

bull Maggiore efficienza nellrsquoupload riscontrata nei test effettuati

23 Metodologia utilizzata ed organizzazione del lavoro

231 Milestones

Il workshop Google Technologies for Cloud and Web Development nel quale egrave statorealizzato il progetto Art Everywhere ha previsto delle milestones intermedieovvero dei momenti di verifica del progetto nei quali egrave stato presentato lo stato diavanzamento del lavoro ed egrave stato valutato dallo staff e dai mentors del workshop

Per la prima milestone (Gennaio 2015) ci siamo concentrati sullo studiodelle tecnologie utilizzate per sviluppare un Minimum Viable Product con lo scopodi presentare e testare le principali caratteristiche dellrsquoapplicazione In particolareabbiamo sviluppato lrsquoUpload delle immagini e la Galleria principale usata permostrare le opere caricate dagli artisti

Per la seconda milestone (Febbraio 2015) ci siamo focalizzati sui feedbackricevuti nella precedente e sui bisogni dei nostri utenti (gli artisti) sottoponendo unsondaggio a piugrave di 50 artisti Sono state aggiunte altre caratteristiche come la Paginadellrsquoartista il Dettaglio opera e i Filtri di ricerca opere La Release Candidate egravestata testata da 10 utenti I risultati dei sondaggi sono stati presentati nel Capitolo 6

Lo scopo della terza milestone (Marzo 2015) era quello di presentare lrsquointe-ro progetto funzionante Lrsquoapplicazione egrave stata completata realizzando la partesocial (Likes Commenti e Condivisione) migliorando lrsquoUser Interface adottando ilMaterial Design e lrsquousabilitagrave dellrsquoapplicazione attraverso dei sondaggi condotti suun campione di utenti

12httpscloudgooglecomappenginedocspythongooglestorage13httpscloudgooglecomstoragedocsoverview

23 Metodologia utilizzata ed organizzazione del lavoro 9

La quarta milestone (Aprile 2015) rappresentava la Final Submission ovve-ro la presentazione del progetto davanti ad una giuria composta oltre che dallostaff del workshop da ingegneri Google Allrsquoapplicazione sono state aggiunte lapossibilitagrave di modificareeliminare unrsquoopera drsquoarte modificareaggiornare il profilodellrsquoartista segnalare un commento o unrsquoopera offensiva e visualizzare la lista dellepersone che hanno messo un Like ad unrsquoopera

232 Divisione del lavoro

Il progetto egrave stato realizzato come lavoro di gruppo durante il workshop GoogleTechnologies for Cloud and Web Development e la suddivisione del lavoro egrave derivatadallrsquoarchitettura three-tier usata come riferimento ovvero interfaccia utente logicafunzionale (business logic) e gestione dei dati persistenti Ciascuno ha poi svi-luppato una o piugrave funzionalitagrave che ha approfondito nella propria relazione al progetto

Il mio personale contributo che viene presentato in queste pagine ha ri-guardato gli algoritmi usati per il trasferimento (uploaddownload) efficiente delleopere drsquoarte ovvero di immagini e per la loro compressione prevenendo unaperdita significativa della qualitagrave Inoltre viene presentato il sistema realizzatoper il riconoscimento di pattern finalizzato ad individuare similaritagrave tra le operedrsquoarte presenti nel database e con opere drsquoarte famose in modo da individuare falsidrsquoautore e prevenire eventuali furti di proprietagrave intellettuale

233 Tool utilizzati

Per coordinare il lavoro abbiamo utilizzato GitHub14 un servizio web di hosting perlo sviluppo di progetti software che ci ha permesso di creare una repository15 perpoter condividere il codice del progetto e lavorare cosigrave simultaneamente Inoltreabbiamo ritenuto molto utile la funzione Issues che rappresenta un ottimo modoper tenere traccia delle attivitagrave miglioramenti e bug del progetto

Abbiamo effettuato revisioni continue circa ogni 23 giorni con lo scopo diverificare lrsquoavanzamento del lavoro in base alle milestones fissate Ciograve egrave avvenutotramite incontri fisici o tramite il servizio di messaggistica istantanea e VoIPHangout16 Google Drive17 egrave stato utilizzato per lrsquoarchiviazione e lo scambio didocumenti condivisi come ad esempio immagini documentazioni diagrammidellrsquoarchitettura e di progettazioneecc Survio18 egrave un software online per crearegratuitamente questionari e sondaggi ed egrave cosigrave stato utilizzato per sottoporre iquestionari presentati nel Capitolo 6 Infine abbiamo utilizzato Android Studio19lrsquoIDE ufficiale per lo sviluppo di applicazioni Android e PyCharm20un ambiente disviluppo per la programmazione Python

14httpsgithubcom15httpsgithubcomdavideaurucciArtEverywhere16httpwwwgooglecom+learnmorehangouts17httpdrivegooglecom18httpwwwsurviocomit19httpsdeveloperandroidcomsdkindexhtml20httpswwwjetbrainscompycharm

10

Capitolo 3

Analisi concettuale del sistema

In questo capitolo viene approfondita la conoscenza del dominio di interesse inmaniera tale da poter descrivere in modo preciso e completo cosa tale progettodeve realizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

31 Modello Entitagrave-Relazioni

LikeEntry

PictureEntryArtistEntry

FlagEntry

TechniqueEntry

CommentEntry

BlacklistEntry

CommentFlag PictureFlag FlaggedPicture

FlaggedComment

PictureParent

CommentBy CommentParent

PictureTechnique

Figura 31 Schema ER dellrsquoapplicazione

311 Vincoli non esprimibili nello schema

Non sono esprimibili nello schema i seguenti vincoli esterni

bull Vincolo sul numero segnalazioni di Visitor forall v isin Istanze(IVisitor)esiste al piugrave un fd isin Istanze(IFlagged) con fd = ltUserv FlagEntryfgt

bull Vincolo sullrsquoattributo likes forall p isin Istanze(IPictureEntry) sia I = ltPictu-reEntryp ArtistEntry agt isin Istanze(ILikeEntry) | a isin Istanze(IArtistEntry)

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

23 Metodologia utilizzata ed organizzazione del lavoro 8

egrave stata deprecata da Google12 in favore dellrsquoutilizzo del solo Google CloudStorage il quale offre un servizio di scrittura file-like similare

bull Google Cloud Datastore offre uno spazio di archiviazione limitato per lrsquoarchi-viazione dei blobs (5GB di spazio free) che si sarebbe saturato facilmente seavessimo scelto di caricare le immagini direttamente su di esso

222 Google Cloud Storage

Google Cloud Storage13 egrave un servizio Internet per memorizzare i dati nel cloud diGoogleQuesta tecnologia egrave stata abbandonata principalmente per due motivi

bull Spazio di archiviazione free inferiore rispetto a quello offerto da Picasa (5GBdi spazio offerti da GCS contro i 15GB di spazio gratuito offerti da GoogleDrive e di conseguenza messi a disposizione per Picasa)

bull Maggiore efficienza nellrsquoupload riscontrata nei test effettuati

23 Metodologia utilizzata ed organizzazione del lavoro

231 Milestones

Il workshop Google Technologies for Cloud and Web Development nel quale egrave statorealizzato il progetto Art Everywhere ha previsto delle milestones intermedieovvero dei momenti di verifica del progetto nei quali egrave stato presentato lo stato diavanzamento del lavoro ed egrave stato valutato dallo staff e dai mentors del workshop

Per la prima milestone (Gennaio 2015) ci siamo concentrati sullo studiodelle tecnologie utilizzate per sviluppare un Minimum Viable Product con lo scopodi presentare e testare le principali caratteristiche dellrsquoapplicazione In particolareabbiamo sviluppato lrsquoUpload delle immagini e la Galleria principale usata permostrare le opere caricate dagli artisti

Per la seconda milestone (Febbraio 2015) ci siamo focalizzati sui feedbackricevuti nella precedente e sui bisogni dei nostri utenti (gli artisti) sottoponendo unsondaggio a piugrave di 50 artisti Sono state aggiunte altre caratteristiche come la Paginadellrsquoartista il Dettaglio opera e i Filtri di ricerca opere La Release Candidate egravestata testata da 10 utenti I risultati dei sondaggi sono stati presentati nel Capitolo 6

Lo scopo della terza milestone (Marzo 2015) era quello di presentare lrsquointe-ro progetto funzionante Lrsquoapplicazione egrave stata completata realizzando la partesocial (Likes Commenti e Condivisione) migliorando lrsquoUser Interface adottando ilMaterial Design e lrsquousabilitagrave dellrsquoapplicazione attraverso dei sondaggi condotti suun campione di utenti

12httpscloudgooglecomappenginedocspythongooglestorage13httpscloudgooglecomstoragedocsoverview

23 Metodologia utilizzata ed organizzazione del lavoro 9

La quarta milestone (Aprile 2015) rappresentava la Final Submission ovve-ro la presentazione del progetto davanti ad una giuria composta oltre che dallostaff del workshop da ingegneri Google Allrsquoapplicazione sono state aggiunte lapossibilitagrave di modificareeliminare unrsquoopera drsquoarte modificareaggiornare il profilodellrsquoartista segnalare un commento o unrsquoopera offensiva e visualizzare la lista dellepersone che hanno messo un Like ad unrsquoopera

232 Divisione del lavoro

Il progetto egrave stato realizzato come lavoro di gruppo durante il workshop GoogleTechnologies for Cloud and Web Development e la suddivisione del lavoro egrave derivatadallrsquoarchitettura three-tier usata come riferimento ovvero interfaccia utente logicafunzionale (business logic) e gestione dei dati persistenti Ciascuno ha poi svi-luppato una o piugrave funzionalitagrave che ha approfondito nella propria relazione al progetto

Il mio personale contributo che viene presentato in queste pagine ha ri-guardato gli algoritmi usati per il trasferimento (uploaddownload) efficiente delleopere drsquoarte ovvero di immagini e per la loro compressione prevenendo unaperdita significativa della qualitagrave Inoltre viene presentato il sistema realizzatoper il riconoscimento di pattern finalizzato ad individuare similaritagrave tra le operedrsquoarte presenti nel database e con opere drsquoarte famose in modo da individuare falsidrsquoautore e prevenire eventuali furti di proprietagrave intellettuale

233 Tool utilizzati

Per coordinare il lavoro abbiamo utilizzato GitHub14 un servizio web di hosting perlo sviluppo di progetti software che ci ha permesso di creare una repository15 perpoter condividere il codice del progetto e lavorare cosigrave simultaneamente Inoltreabbiamo ritenuto molto utile la funzione Issues che rappresenta un ottimo modoper tenere traccia delle attivitagrave miglioramenti e bug del progetto

Abbiamo effettuato revisioni continue circa ogni 23 giorni con lo scopo diverificare lrsquoavanzamento del lavoro in base alle milestones fissate Ciograve egrave avvenutotramite incontri fisici o tramite il servizio di messaggistica istantanea e VoIPHangout16 Google Drive17 egrave stato utilizzato per lrsquoarchiviazione e lo scambio didocumenti condivisi come ad esempio immagini documentazioni diagrammidellrsquoarchitettura e di progettazioneecc Survio18 egrave un software online per crearegratuitamente questionari e sondaggi ed egrave cosigrave stato utilizzato per sottoporre iquestionari presentati nel Capitolo 6 Infine abbiamo utilizzato Android Studio19lrsquoIDE ufficiale per lo sviluppo di applicazioni Android e PyCharm20un ambiente disviluppo per la programmazione Python

14httpsgithubcom15httpsgithubcomdavideaurucciArtEverywhere16httpwwwgooglecom+learnmorehangouts17httpdrivegooglecom18httpwwwsurviocomit19httpsdeveloperandroidcomsdkindexhtml20httpswwwjetbrainscompycharm

10

Capitolo 3

Analisi concettuale del sistema

In questo capitolo viene approfondita la conoscenza del dominio di interesse inmaniera tale da poter descrivere in modo preciso e completo cosa tale progettodeve realizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

31 Modello Entitagrave-Relazioni

LikeEntry

PictureEntryArtistEntry

FlagEntry

TechniqueEntry

CommentEntry

BlacklistEntry

CommentFlag PictureFlag FlaggedPicture

FlaggedComment

PictureParent

CommentBy CommentParent

PictureTechnique

Figura 31 Schema ER dellrsquoapplicazione

311 Vincoli non esprimibili nello schema

Non sono esprimibili nello schema i seguenti vincoli esterni

bull Vincolo sul numero segnalazioni di Visitor forall v isin Istanze(IVisitor)esiste al piugrave un fd isin Istanze(IFlagged) con fd = ltUserv FlagEntryfgt

bull Vincolo sullrsquoattributo likes forall p isin Istanze(IPictureEntry) sia I = ltPictu-reEntryp ArtistEntry agt isin Istanze(ILikeEntry) | a isin Istanze(IArtistEntry)

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

23 Metodologia utilizzata ed organizzazione del lavoro 9

La quarta milestone (Aprile 2015) rappresentava la Final Submission ovve-ro la presentazione del progetto davanti ad una giuria composta oltre che dallostaff del workshop da ingegneri Google Allrsquoapplicazione sono state aggiunte lapossibilitagrave di modificareeliminare unrsquoopera drsquoarte modificareaggiornare il profilodellrsquoartista segnalare un commento o unrsquoopera offensiva e visualizzare la lista dellepersone che hanno messo un Like ad unrsquoopera

232 Divisione del lavoro

Il progetto egrave stato realizzato come lavoro di gruppo durante il workshop GoogleTechnologies for Cloud and Web Development e la suddivisione del lavoro egrave derivatadallrsquoarchitettura three-tier usata come riferimento ovvero interfaccia utente logicafunzionale (business logic) e gestione dei dati persistenti Ciascuno ha poi svi-luppato una o piugrave funzionalitagrave che ha approfondito nella propria relazione al progetto

Il mio personale contributo che viene presentato in queste pagine ha ri-guardato gli algoritmi usati per il trasferimento (uploaddownload) efficiente delleopere drsquoarte ovvero di immagini e per la loro compressione prevenendo unaperdita significativa della qualitagrave Inoltre viene presentato il sistema realizzatoper il riconoscimento di pattern finalizzato ad individuare similaritagrave tra le operedrsquoarte presenti nel database e con opere drsquoarte famose in modo da individuare falsidrsquoautore e prevenire eventuali furti di proprietagrave intellettuale

233 Tool utilizzati

Per coordinare il lavoro abbiamo utilizzato GitHub14 un servizio web di hosting perlo sviluppo di progetti software che ci ha permesso di creare una repository15 perpoter condividere il codice del progetto e lavorare cosigrave simultaneamente Inoltreabbiamo ritenuto molto utile la funzione Issues che rappresenta un ottimo modoper tenere traccia delle attivitagrave miglioramenti e bug del progetto

Abbiamo effettuato revisioni continue circa ogni 23 giorni con lo scopo diverificare lrsquoavanzamento del lavoro in base alle milestones fissate Ciograve egrave avvenutotramite incontri fisici o tramite il servizio di messaggistica istantanea e VoIPHangout16 Google Drive17 egrave stato utilizzato per lrsquoarchiviazione e lo scambio didocumenti condivisi come ad esempio immagini documentazioni diagrammidellrsquoarchitettura e di progettazioneecc Survio18 egrave un software online per crearegratuitamente questionari e sondaggi ed egrave cosigrave stato utilizzato per sottoporre iquestionari presentati nel Capitolo 6 Infine abbiamo utilizzato Android Studio19lrsquoIDE ufficiale per lo sviluppo di applicazioni Android e PyCharm20un ambiente disviluppo per la programmazione Python

14httpsgithubcom15httpsgithubcomdavideaurucciArtEverywhere16httpwwwgooglecom+learnmorehangouts17httpdrivegooglecom18httpwwwsurviocomit19httpsdeveloperandroidcomsdkindexhtml20httpswwwjetbrainscompycharm

10

Capitolo 3

Analisi concettuale del sistema

In questo capitolo viene approfondita la conoscenza del dominio di interesse inmaniera tale da poter descrivere in modo preciso e completo cosa tale progettodeve realizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

31 Modello Entitagrave-Relazioni

LikeEntry

PictureEntryArtistEntry

FlagEntry

TechniqueEntry

CommentEntry

BlacklistEntry

CommentFlag PictureFlag FlaggedPicture

FlaggedComment

PictureParent

CommentBy CommentParent

PictureTechnique

Figura 31 Schema ER dellrsquoapplicazione

311 Vincoli non esprimibili nello schema

Non sono esprimibili nello schema i seguenti vincoli esterni

bull Vincolo sul numero segnalazioni di Visitor forall v isin Istanze(IVisitor)esiste al piugrave un fd isin Istanze(IFlagged) con fd = ltUserv FlagEntryfgt

bull Vincolo sullrsquoattributo likes forall p isin Istanze(IPictureEntry) sia I = ltPictu-reEntryp ArtistEntry agt isin Istanze(ILikeEntry) | a isin Istanze(IArtistEntry)

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

10

Capitolo 3

Analisi concettuale del sistema

In questo capitolo viene approfondita la conoscenza del dominio di interesse inmaniera tale da poter descrivere in modo preciso e completo cosa tale progettodeve realizzare indipendentemente dagli aspetti implementativi Inoltre vengonodefinite in modo rigoroso e formale tutte le entitagrave e le relazioni del sistema

31 Modello Entitagrave-Relazioni

LikeEntry

PictureEntryArtistEntry

FlagEntry

TechniqueEntry

CommentEntry

BlacklistEntry

CommentFlag PictureFlag FlaggedPicture

FlaggedComment

PictureParent

CommentBy CommentParent

PictureTechnique

Figura 31 Schema ER dellrsquoapplicazione

311 Vincoli non esprimibili nello schema

Non sono esprimibili nello schema i seguenti vincoli esterni

bull Vincolo sul numero segnalazioni di Visitor forall v isin Istanze(IVisitor)esiste al piugrave un fd isin Istanze(IFlagged) con fd = ltUserv FlagEntryfgt

bull Vincolo sullrsquoattributo likes forall p isin Istanze(IPictureEntry) sia I = ltPictu-reEntryp ArtistEntry agt isin Istanze(ILikeEntry) | a isin Istanze(IArtistEntry)

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

31 Modello Entitagrave-Relazioni 11

lrsquoinsieme di tuple in LikeEntry cui p partecipa e sia likesIstanze(IPictureEntry)rarr N attributo dellrsquoentitagrave PictureEntry si ha likes(p) = |I| cardinalitagravedellrsquoinsieme I

312 Glossario delle entitagrave e delle relazioni

Glossario delle entitagraveEntitagrave Descrizione Attributi IdentificatoriUser Un utente dellrsquoapplicazione Email Email

Artist Entry Un utente di tipo artista Cognome UserNomePicNicknamePhoto_idBioSitoBan_Counter

Visitor Un utente di tipo visitatore UserPicture Entry Unrsquoopera drsquoarte Url Url

TitlePhoto_idDate_timeDescrLuogoDimLikes

Comment Entry Un commento di un utente Id IdCommentDate_time

Flag Entry Una segnalazione da unrsquoartista Key KeyComment Flag Segnalazione per un commento Flag EntryPicture Flag Segnalazione per unrsquoopera drsquoarte Flag Entry

Blacklist Entry Una email bannata dal servizio UserTechnique Entry Una tecnica pittorica Nome Nome Key

Key

Glossario delle relazioniRelazione Descrizione Componenti Attributi IdentificatoriPicture Pa-rent

Autore dellrsquooperadrsquoarte

ArtistEntryPictureEntry

Picture Entry

PictureTechnique

Tecnica dellrsquooperadrsquoarte

TechniqueEntryPicture Entry

Picture Entry

CommentParent

Opera drsquoarte del com-mento

CommentEntryPictureEntry

CommentEntry

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

31 Modello Entitagrave-Relazioni 12

CommentBy

Autore del commento CommentEntryUser

CommentEntry

Like Entry Un like di un artista PictureEntryArtistEntry

Date_time Artist Entry Pic-tureEntry

LikeParent

Opera drsquoarte del like LikeEntry Pic-tureEntry

Like Entry

Liked By Autore del like LikeEntry Arti-stEntry

Like Entry

Flagger Mittente del flag FlagEntry Ar-tistEntry

Flag Entry

Flagged Destinatario del flag FlagEntryUser

Flag Entry

FlaggedPicture

Opera drsquoarte segnala-ta

PictureFlagPictureEntry

Picture Flag

FlaggedComment

Commento segnalato CommentFlagCommentEn-try

Comment Flag

IsBlocked Utente bloccato Blacklist Entry Blacklist EntryUser

313 Ristrutturazione dello schema ER

1 Preparazione dello schema ERNella fase 1 evidenziamo tutti i vincoli di identificazione (implicati e non)rilevanti (Fig 32)

Like Entry

Figura 32 Schema ER dopo la fase 1 della ristrutturazione

2 Analisi delle ridondanzeEgrave presente unrsquounica ridondanza allrsquointerno dello schema lrsquoattributo likesallrsquointerno dellrsquoentitagrave Picture Entry scelgo di conservarlo in quanto egrave di

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

31 Modello Entitagrave-Relazioni 13

LikeEntry

PictureEntryArtistEntry

BlacklistEntry

FlagEntry

PictureFlagCommentFlag

CommentEntry

TechniqueEntry

CommentBy

PictureTechnique

PictureParent

CommentParent

FlaggedPicture

FlaggedComment

Figura 33 Schema ER dopo la fase 5 della ristrutturazione

interesse conoscere il numero di like apposti su una certa opera drsquoarte e ilcalcolo di tale numero egrave unrsquooperazione frequente

3 Eliminazione degli attributi multivaloreNon egrave presente alcun attributo multivalore nello schema

4 Eliminazione degli attributi compostiNon egrave presente alcun attributo composto nello schema

5 Eliminazione delle ISA e delle generalizzazioniSono presenti due generalizzazioni nello schema

bull Una generalizzazione completa sullrsquoentitagrave Userbull Una generalizzazione completa sullrsquoentitagrave Flag Entry

Si ottiene lo schema di Fig 33 privato delle ISAgeneralizzazioni

6 Scelta degli identificatori principali di entitagrave e relazioniScegliamo (laddove ce ne sia piugrave di uno) lrsquoidentificatore principale delle entitagravee delle relazioni Per Flag Entry che non possiede alcun identificatore utiliz-ziamo un identificatore di tipo numerico di nome key Otteniamo lo schemaristrutturato di Fig 34

7 Specifica degli ulteriori vincoli esterniSono presenti nello schema due ulteriori vincoli esterni derivatidallrsquoeliminazione delle generalizzazioni su User e FlagEntry

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

31 Modello Entitagrave-Relazioni 14

Figura 34 Schema ER dopo la fase 6 della ristrutturazione

bull forall u isin Istanze(IUser) esiste esattamente uno tra vu isin Istan-ze(IISA_V_U) con vu = ltUseru Visitorvgt e au isin Istan-ze(IISA_A_U) con au = ltUseru ArtistEntryagt

bull forall f isin Istanze(IFlagEntry) esiste esattamente uno tra cf isin Istan-ze(IISA_C_F) con cf = ltFlagEntryf CommentFlagcgt e pf isinIstanze(IISA_P_F) con pf = ltFlagEntryf PictureFlagpgt

Mentre il ldquovincolo sul numero segnalazioni di Visitorrdquo viene riformulato nelmodo seguente

forall v isin Istanze(IVisitor) esiste al piugrave un fd isin Istanze(IFlagged) con fd =ltUseru FlagEntryfgt tc esiste vu isin Istanze(IISA_V_U) con vu = ltUseruVisitorvgt

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

32 Use Case Diagram 15

32 Use Case Diagram

Figura 35 Use Case Diagram dellrsquoapplicazione

Nella Fig 35 sono stati evidenziati i casi drsquouso che vengono approfonditi in questolavoro di tesi Vengono descritti alcuni servizi offerti dal sistema cosigrave come vengonopercepiti e utilizzati dagli attori che interagiscono con il sistema stesso

321 Carica opera drsquoarte

Nome Carica opera drsquoarteAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

Scenario principale

1 Artista avvia la schermata per caricare lrsquoopera drsquoarte

2 Artista sceglie lrsquoimmagine dalla galleria o scatta una fotografia

3 Artista compila i dettagli informativi (nome descrizione luogo dimensioni)

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

32 Use Case Diagram 16

4 Artista sceglie la tecnica artistica

5 Sistema controlla la validitagrave dei campi

6 Artista avvia il caricamento dellrsquoimmagine

7 Sistema controlla la similaritagrave dellrsquoopera appena caricata con le altre immaginipresenti nel database

322 Ricerca opera drsquoarte

Nome Ricerca opera drsquoarteAttore Utente

Obiettivo Ricercare unrsquoopera drsquoarte attraverso i filtri disponibili

Scenario principale

1 Utente clicca il bottone dal menugrave per avviare la ricerca filtrata

2 Utente avvia la ricerca in base al filtro scelto

3 Sistema provvede a fornire una lista delle opere

4 Utente visualizza le opere in ordine cronologico

5 Utente scorre la griglia di immagini

6 Utente clicca su una delle immagini per visualizzare i dettagli

Estensioni

2 Utente sceglie il filtro (per artista per luogo per tecnica)

323 Visualizza galleria delle opere

Nome Visualizza galleria delle opereAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

Scenario principale

1 Utente avvia app

2 Sistema provvede a fornire una lista delle opere caricate

3 Utente visualizza le opere in ordine cronologico

4 Utente scorre la griglia di immagini

5 Utente clicca su una delle immagini per visualizzare i dettagli

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

17

Capitolo 4

Progettazione del sistema

In questo capitolo si presenta lrsquoarchitettura del sistema e si procede alla progettazionelogica di esso con lo scopo di derivare uno schema logico che sia il piugrave fedele possibileallo schema ER di partenza e che sia al tempo stesso efficiente

41 Architettura del sistemaLo schema architetturale dellrsquoapplicazione egrave quello descritto dalla Fig 41

Figura 41 Schema architetturale dellrsquoapplicazione

Esso egrave costituito da cinque parti principali

bull Unrsquoapplicazione mobile (Android) che egrave il Frontend del sistema

bull Unrsquointerfaccia applicativa (API) verso lrsquoapplicazione mobile realizzata medianteGoogle Cloud Endpoints

bull Unrsquoapplicazione App Engine che egrave il Backend del sistema

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

42 Progettazione logica del data layer 18

bull Picasa Web Albums che viene utilizzato per caricare e memorizzare inmaniera persistente le opere caricate dagli utenti

bull Una Flask Application ospitata sullo spazio hosting PythonAnywhere chesi occupa di controllare la similaritagrave tra opere drsquoarte (viene invocata tramitechiamata RESTful dal backend)

42 Progettazione logica del data layer

421 Schema logico dei dati

Con la traduzione diretta dello Schema ER di Fig 34 si ottiene il seguente schemalogicoUser(email)

Visitor(email)Foreign key Visitor[email] sube User[email]

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube User[email]

TechniqueEntry(key nome)Chiave nome

PictureEntry(url title photo_id date_time descr luogo dim likes)Foreign key PictureEntry[url] sube PictureParent[picture]Foreign key PictureEntry[url] sube PictureTechnique[picture]

CommentEntry(id comment date_time)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[id] sube CommentParent[comment]

LikeEntry(artist picture date_time)Foreign key LikeEntry[artist sube ArtistEntry[email]Foreign key LikeEntry[picture] sube PictureEntry[url]

BlacklistEntry(email)Foreign key BlacklistEntry[email] sube User[email]

FlagEntry(key)Foreign key FlagEntry[key] sube Flagger[flag]Foreign key FlagEntry[key] sube Flagged[flag]

CommentFlag(flag)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[flag] sube FlaggedComment[commentFlag]

PictureFlag(flag)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[flag] sube

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

42 Progettazione logica del data layer 19

Flagger(flag artist)Foreign key Flagger[flag] sube FlagEntry[key]Foreign key Flagger[flag] sube ArtistEntry[email]

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]Foreign key Flagged[flag] sube User[email]

FlaggedComment(commentFlag comment)Foreign key FlaggedComment[commentFlag] sube CommentFlag[flag]Foreing key FlaggedComment[comment] sube CommentEntry[id]

FlaggedPicture(pictureFlag picture)Foreign key FlaggedPicture[pictureFlag] sube PictureFlag[flag]Foreign key FlaggedPicture[picture] sube PictureEntry[url]

PictureParent(picture artist)Foreign key PictureParent[picture] sube PictureEntry[url]Foreign key PictureParent[artist] sube ArtistEntry[email]

PictureTechnique(picture technique)Foreign key PictureTechnique[picture] sube PictureEntry[url]Foreign key PictureTechnique[technique] sube TechniqueEntry[key]

CommentParent(comment picture)Foreign key CommentParent[comment] sube CommentEntry[id]Foreign key CommentParent[picture] sube PictureEntry[url]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]Foreign key CommentBy[user] sube User[email]

Con i seguenti vincoli esterni

bull User[email] sube Visitor[email] cup ArtistEntry[email]

bull Visitor[email] cap AartistEntry[email] = Oslash

bull FlagEntry[key] sube CommentFlag[flag] cup PictureFlag[flag]

bull CommentFlag[flag] cap PictureFlag[flag] = Oslash

422 Ristrutturazione dello schema logico

1 Decomposizione orizzontale di User in UserArtist e UserVisitor UserArtist(email)

UserVisitor(email)

ArtistEntry(email nome cognome pic nick photo_id bio sito ban_counter)Foreign key ArtistEntry[email] sube UserArtist[email]

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

42 Progettazione logica del data layer 20

Visitor(email)Foreign key Visitor[email] sube UserVisitor[email]

BlacklistEntry(email)

Flagged(flag user)Foreign key Flagged[flag] sube FlagEntry[key]

CommentBy(comment user)Foreign key CommentBy[comment] sube CommentEntry[id]

Con i seguenti vincoli esterni

bull BlacklistEntry[user] sube UserVisitor[email] cup UserArtist[email]bull Flagged[user] sube UserVisitor[email]] cup UserArtist[email]bull CommentBy[user] sube UserVisitor[email]] cup UserArtist[email]

2 Accorpamento di UserArtist e ArtistEntry e di UserVisitor e Visitor ArtistEntry(email nome cognome pic nick photo_id bio sitoban_counter)

Visitor(email)

Dove i precedenti vincoli esterni diventano

bull BlacklistEntry[user] sube Visitor[email] cup ArtistEntry[email]bull Flagged[user] sube Visitor[email]] cup ArtistEntry[email]bull CommentBy[user] sube Visitor[email]] cup ArtistEntry[email]

3 Accorpamento di PictureEntry e PictureParentPictureEntry(url title photo_id date_time descr luogo dim likes artist)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[url] sube PictureTechnique[picture]

4 Accorpamento di PictureEntry e PictureTechniquePictureEntry(url title photo_id date_time descr luogo dim likes artist technique)Foreign key PictureEntry[artist] sube ArtistEntry[email]Foreign key PictureEntry[technique] sube TechniqueEntry[key]

5 Accorpamento di CommentEntry e CommentParentCommentEntry(id comment date_time picture)Foreign key CommentEntry[id] sube CommentBy[comment]Foreign key CommentEntry[picture] sube PictureEntry[url]

6 Accorpamento di CommentEntry e CommentByCommentEntry(id comment date_time picture user)Foreign key CommentEntry[picture] sube PictureEntry[url]

Con vincolo esternoCommentEntry[user] sube Visitor[email] cup ArtistEntry[email]

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

42 Progettazione logica del data layer 21

7 Accorpamento di FlagEntry e Flagger FlagEntry(key flagger)Foreign key FlagEntry[flagger] sube ArtistEntry[email]Foreign key FlagEntry[key] sube Flagged[flag]

8 Accorpamento di FlagEntry e FlaggedFlagEntry(key flagger flagged)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincolo esternoFlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

9 Accorpamento di CommentFlag e FlaggedCommentCommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntry[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

10 Accorpamento di PictureFlag e FlaggedPicturePictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntry[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

11 Decomposizione orizzontale di FlagEntry in FlagEntryComment e FlagEntryPictureFlagEntryComment(key flagger flagged)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]

FlagEntryPicture(key flagger flagged)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]

CommentFlag(flag comment)Foreign key CommentFlag[flag] sube FlagEntryComment[key]Foreign key CommentFlag[comment] sube CommentEntry[id]

PictureFlag(flag picture)Foreign key PictureFlag[flag] sube FlagEntryPicture[key]Foreign key PictureFlag[picture] sube PictureEntry[url]

Con vincoli esterni

bull FlagEntryComment[flagged sube Visitor[email] cup ArtistEntry[email]bull FlagEntryPicture[flagged] sube Visitor[email] cup ArtistEntry[email]

12 Accorpamento di FlagEntryComment e CommentFlagFlagEntryComment(key flagger flagged comment)Foreign key FlagEntryComment[flagger] sube ArtistEntry[email]Foreign key FlagEntryComment[comment] sube CommentEntry[id]

13 Accorpamento di FlagEntryPicture e PictureFlagFlagEntryPicture(key flagger flagged picture)Foreign key FlagEntryPicture[flagger] sube ArtistEntry[email]Foreign key FlagEntryPicture[picture] sube PictureEntry[url]

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

42 Progettazione logica del data layer 22

14 Accorpamento di FlagEntryComment e FlagEntryPicture (poicheacute si riesce adistinguere gli identificatori di due differenti entitagrave si preferisce conservareunrsquounica entitagrave)

FlagEntry(key flagger flagged content)Foreign key FlagEntry[flagger] sube ArtistEntry[email]

Con vincoli esterni

bull FlagEntry[content] sube PictureEntry[url] cup CommentEntry[id]bull FlagEntry[flagged] sube Visitor[email] cup ArtistEntry[email]

15 Accorpamento per eliminare la relazione inutile Visitor Infatti poicheacute perlrsquoentitagrave Visitor non si memorizza alcuna proprietagrave oltre lrsquoemail (la quale servesolo per monitorare i commenti inseriti) si egrave scelto di rimuoverla accorpandolaallrsquoentitagrave CommentEntry I vincoli esterni che coinvolgevano Visitor vengonoriformulati nel modo seguente

bull FlagEntry[flagged]] sube CommentEntry[user] cup ArtistEntry[email]bull BlacklistEntry[user] sube CommentEntry[user] cup ArtistEntry[email]

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

23

Capitolo 5

Realizzazione del sistema

In questo capitolo viene mostrata la realizzazione delle interfacce utente riguardantelrsquoupload e il download delle immagini Inolte ci si sofferma maggiormente sullosviluppo degli algoritmi usati per il trasferimento efficiente e per la compressione diimmagini prevenendo una significativa perdita di qualitagrave Viene inoltre presentatoil sistema realizzato per il riconoscimento di pattern finalizzato ad individuaresimilaritagrave tra opere drsquoarte

51 Upload immagini

511 Sequence diagram

Figura 51 Sequence Diagram dellrsquoUpload Immagini

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

51 Upload immagini 24

Nome Upload immagineAttore Artista

Obiettivo Caricare lrsquoimmagine dellrsquoopera drsquoarte con i suoi dettagliinformativi

512 Implementazione

Lrsquoartista ha due possibilitagrave per scegliere unrsquoopera drsquoarte dalla galleria del propriosmartphone oppure dalla fotocamera scattando cosigrave una foto In entrambi i casiviene salvata lrsquoimmagine nella memoria dello smartphone in modo da essereprocessata in seguito Infatti lrsquoimmagine verragrave compressa e lrsquoimplementazionedellrsquoalgoritmo di compressione viene presentato in 52

UploadActivityjavaprotected void onCreate(Bundle savedInstanceState)

btn_choosesetOnClickListener(new ViewOnClickListener() Overridepublic void onClick(View v)

Intent takePictureIntent = newIntent(MediaStoreACTION_IMAGE_CAPTURE)

Ensure that therersquos a camera activity to handle the intentif (takePictureIntentresolveActivity(getPackageManager()) =

null) Create the File where the photo should goFile photoFile = nulltry

photoFile = createImageFile() catch (IOException ex) Error occurred while creating the File

return Continue only if the File was successfully createdif (photoFile = null)

outputFileUri = UrifromFile(photoFile)takePictureIntentputExtra(MediaStoreEXTRA_OUTPUT

outputFileUri) This intent presents applications that allow the user to

choose a pictureIntent pickIntent = new Intent()pickIntentsetType(image)pickIntentsetAction(IntentACTION_PICK) This intent prompts the user to choose from a list of

possible intentsString pickTitle = Scegli o scatta una fotoIntent chooserIntent = IntentcreateChooser(pickIntent

pickTitle)chooserIntentputExtra(IntentEXTRA_INITIAL_INTENTS

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

51 Upload immagini 25

new Intent[] takePictureIntent )startActivityForResult(chooserIntent REQUEST_TAKE_PHOTO)

)String filename = compressImage(selectedImageUritoString())Bitmap bitmap = BitmapFactorydecodeFile(filename)ByteArrayOutputStream bao = new ByteArrayOutputStream()bitmapcompress(BitmapCompressFormatJPEG 100 bao)ba = baotoByteArray()imageToUpload= Base64encodeToString(ba Base64DEFAULT)

Lrsquoartista oltre a caricare lrsquoopera drsquoarte puograve aggiungere informazioni a riguardocome il titolo la descrizioneecc Prima di invocare il servizio remoto viene effettuatoun controllo di validitagrave sui parametri obbligatori Se il controllo va a buon fine vieneinvocato il metodo remoto grazie ad un AsyncTask ovvero una classe di Androidche consente di effettuare delle elaborazioni in background e mostrarne i risultatisullrsquoUI del thread principale Un task asincrono egrave definito da 3 tipi generici chiamatiParams Progress e Results e 4 steps chiamati OnPreExecute doInBackgroundonProgressUpdate e OnPostExecute

UploadActivityjavaif(checkNetwork())

if(isFoto)ToastmakeText(getApplicationContext() Devi scegliere una foto

ToastLENGTH_LONG)show()else if(ValidoCampo(filenamegetText()toString()))

ToastmakeText(getApplicationContext() Inserisci un titoloToastLENGTH_LONG)show()

else if(isTecnica)ToastmakeText(getApplicationContext() Devi scegliere una

tecnica ToastLENGTH_LONG)show()else

AsyncTaskltVoid Void MainUploadRequestMessagegt upPhoto = newAsyncTaskltVoid Void MainUploadRequestMessagegt()

Overrideprotected MainUploadRequestMessage doInBackground(Void unused)

Retrieve service handleArtEverywhere apiServiceHandle =

AppConstantsgetApiServiceHandle(null)

try MainUploadRequestMessage greeting = new MainUploadRequestMessage()greetingsetTitle(filenamegetText()toString())greetingsetImage(imageToUpload)greetingsetArtist(artist)greetingsetTechnique(tecnicaScelta)

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

51 Upload immagini 26

if(descriptiongetText()toString()equals())greetingsetDescr(descriptiongetText()toString())

if(sizegetText()toString()equals())greetingsetDim(sizegetText()toString())

if(placegetText()toString()equals())greetingsetLuogo(placegetText()toString())

ArtEverywhereUploadPutphoto up =apiServiceHandleupload()putphoto(greeting)

upexecute()

return greeting catch (IOException e)

ToastmakeText(getApplicationContext() Exception during APIcall ToastLENGTH_LONG)show()

return null

Overrideprotected void onPreExecute()

superonPreExecute()mBuildersetProgress(100 0 false)mBuildersetProgress(0 0 true)mNotifyManagernotify(1 mBuilderbuild())

Overrideprotected void onPostExecute(MainUploadRequestMessage greeting)

if (greeting = null) mBuildersetContentText(Upload complete) Removes the progress barmBuildersetProgress(0 0 false)mNotifyManagernotify(1 mBuilderbuild())

ToastmakeText(getApplicationContext() Caricamentocompletato ToastLENGTH_LONG)show()

ToastmakeText(getApplicationContext() Caricamento artwork incorso ToastLENGTH_LONG)show()

upPhotoexecute()

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

52 Algoritmo di compressione immagini Whatsapp-like 27

513 Aspetti particolari

Per poter permettere un trasferimento efficiente e il piugrave rapido possibile egrave stata difondamentale importanza la compressione delle immagini che ha permesso non solodi ridurre il tempo necessario per inviare tramite Internet le immagini ma ancheaumentare lo spazio di memoria a disposizione Nella sezione 52 viene trattato inmodo approfondito lrsquoalgoritmo di compressione utilizzato

52 Algoritmo di compressione immagini Whatsapp-like

521 Stato dellrsquoarte

Ogni giorno unrsquoenorme quantitagrave di informazioni sono memorizzate processate etrasmesse digitalmente Siamo di fronte ad un crescente utilizzo di immagini in moltimomenti della nostra vita sistemi di visione 3D satelliti telecamere apparecchiaturemedicheecc utilizzano le immagini per diversi scopi e si ha la necessitagrave di utilizzareimmagini compresse a causa della limitazione dello spazio su disco e della larghezzadi banda del canaleSi ha cosigrave la necessitagrave di comprimere le immagini per ridurre la dimensione dei datiche devono essere salvati eo trasmessi Come specificato in [9] la base sottostantedel processo di riduzione egrave la rimozione dei dati ridondantiNella compressione delle immagini digitali possono essere indentificati e sfruttatitre tipi di ridondanze La compressione dati avviene quando uno o piugrave di questeridondanze sono ridotte o eliminate

bull ridondanza di codifica lrsquoimmagine non compressa egrave di solito codificata inmodo che ogni pixel abbia una lunghezza fissa Ad esempio unrsquoimmaginecon 256 livelli di grigio egrave rappresentata da una matrice di interi a 8 bitUtilizzando alcuni schemi di codici a lunghezza variabile come la codifica diHamming o la codifica aritmetica si puograve ridurre la quantitagrave di dati utilizzataper rappresentare lrsquoimmagine

bull ridondanza spaziale (o ridondanza interpixelinterframe) sfrutta il fattoche lrsquoimmagine contiene molto spesso pixel fortemente correlati e quindi inaltre parole grandi regioni i cui pixel sono uguali o quasi uguali Questotipo di ridondanza puograve essere esplorata in vari modi ad esempio valutando ledipendenze statistiche tra pixel adiacenti e quindi prevedere un valore di pixelin base ai valori dei pixel vicini

bull ridondanza psico-visiva molti esperimenti sugli aspetti psicofisici dellavisione umana hanno dimostrato che lrsquoocchio umano non risponde con ugualesensibilitagrave a tutte le informazioni visive in entrata e quindi alcune informazionisono piugrave importanti di altri Eliminando le informazioni meno importanti ilrisultato egrave un file di immagine compresso la cui dimensione e qualitagrave sonopiugrave piccoli delle informazioni originali ma la cui qualitagrave risultante egrave ancoraaccettabile per lrsquoapplicazione in questione

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

52 Algoritmo di compressione immagini Whatsapp-like 28

Le tecniche di compressione delle immagini sono state classificate in due categorie

bull lossless (senza perdita) non porta alcuna perdita delle informazioni originalidurante la fase di compressione dei dati Come riportato in [9] le tecniche dicompressione senza perdita sono composte da due operazioni relativamenteindipendenti ideare una rappresentazione alternativa dellrsquoimmagine in cuila sua ridondanza spaziale egrave ridotta e codificare una rappresentazione pereliminare la ridondanza di codifica

bull lossy (con perdita) porta ad alcune perdite delle informazioni originali Taletipologia si basa sul concetto di compromettere la precisione dellrsquoimmaginericostruita in cambio di una maggiore compressione Se le distorsioni delleimmagini (che possono essere o non essere apparentemente visibili) possonoessere tollerate allora la qualitagrave risultante egrave accettabile [8]

Come presentato in [11] nei dispositivi Android la gestione della memoria egrave diven-tata una delle principali preoccupazioni percheacute ha un impatto significativo sulleprestazioni del sistema e la durata della batteria Inoltre egrave importante utilizzare egestire lo spazio di memoria interna ed esterna in modo efficiente Quindi egrave essenzialerealizzare funzioni che contribuiscano a ridurre il consumo di memoria Per talemotivo egrave fondamentale ridurre al minimo la dimensione in byte di unrsquoimmagine senzadegradare la sua qualitagrave La riduzione delle dimensioni del file non solo permetteun maggiore spazio di memoria ma riduce anche il tempo necessario per inviaretramite Internet le immaginiQuesti sono fattori essenziali che sono stati tenuti in considerazione durante losviluppo di questo progetto

522 Metodo proposto e implementazione

Il metodo proposto comprime le immagini mantenendo le proporzioni dellrsquoimmagineoriginale e prevenendo una significativa perdita di qualitagrave convertendole in JPEG eutilizzando la tecnica di compressione con perdita Ciograve funziona bene sotto lrsquoipotesiche la maggior parte delle immagini sono fotografieimmagini delle fotocamerae hanno una gamma di colore dinamica Pertanto viene utilizzata la ridondanzapsico-visiva che comporta infatti una perdita di informazioni ldquopoco importantirdquoche lrsquoocchio umano non egrave in grado di rilevare

UploadActivityjavapublic String compressImage(String imageUri)

String filePath = getRealPathFromURI(imageUri)Bitmap scaledBitmap = null

BitmapFactoryOptions options = new BitmapFactoryOptions()optionsinJustDecodeBounds = true

Bitmap bmp = BitmapFactorydecodeFile(filePath options)

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

52 Algoritmo di compressione immagini Whatsapp-like 29

int actualHeight = optionsoutHeightint actualWidth = optionsoutWidth

max height and width values of the compressed image is taken as816x612

float maxHeight = 8160ffloat maxWidth = 6120ffloat imgRatio = actualWidth actualHeightfloat maxRatio = maxWidth maxHeight

width and height values are set maintaining the aspect ratio of theimage

if (actualHeight gt maxHeight || actualWidth gt maxWidth) if (imgRatio lt maxRatio)

imgRatio = maxHeight actualHeightactualWidth = (int) (imgRatio actualWidth)actualHeight = (int) maxHeight

else if (imgRatio gt maxRatio) imgRatio = maxWidth actualWidthactualHeight = (int) (imgRatio actualHeight)actualWidth = (int) maxWidth

else actualHeight = (int) maxHeightactualWidth = (int) maxWidth

setting inSampleSize value allows to load a scaled down version ofthe original image

optionsinSampleSize = calculateInSampleSize(options actualWidthactualHeight)

optionsinJustDecodeBounds = false

this options allow android to claim the bitmap memory if it runs lowon memory

optionsinTempStorage = new byte[16 1024]

try load the bitmap from its pathbmp = BitmapFactorydecodeFile(filePath options)

catch (OutOfMemoryError exception) exceptionprintStackTrace()

try scaledBitmap = BitmapcreateBitmap(actualWidth

actualHeightBitmapConfigARGB_8888) catch (OutOfMemoryError exception)

exceptionprintStackTrace()

float ratioX = actualWidth (float) optionsoutWidth

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

52 Algoritmo di compressione immagini Whatsapp-like 30

float ratioY = actualHeight (float) optionsoutHeightfloat middleX = actualWidth 20ffloat middleY = actualHeight 20f

Matrix scaleMatrix = new Matrix()scaleMatrixsetScale(ratioX ratioY middleX middleY)

Canvas canvas = new Canvas(scaledBitmap)canvassetMatrix(scaleMatrix)canvasdrawBitmap(bmp middleX - bmpgetWidth() 2 middleY -

bmpgetHeight() 2 new Paint(PaintFILTER_BITMAP_FLAG))

write the compressed bitmap at the destination specified by filenameFileOutputStream out = nullString filename = getFilename()try

out = new FileOutputStream(filename)scaledBitmapcompress(BitmapCompressFormatJPEG 80 out)

catch (FileNotFoundException e) eprintStackTrace()

return filename

The sample size is the number of pixels in either dimension thatcorrespond to a single pixel in the decoded bitmap For exampleinSampleSize == 4 returns an image that is 14 the widthheight of theoriginal and 116 the number of pixels

public int calculateInSampleSize(BitmapFactoryOptions options intreqWidth int reqHeight)

final int height = optionsoutHeightfinal int width = optionsoutWidthint inSampleSize = 1

if (height gt reqHeight || width gt reqWidth) final int heightRatio = Mathround((float) height (float) reqHeight)final int widthRatio = Mathround((float) width (float) reqWidth)inSampleSize = heightRatio lt widthRatio heightRatio widthRatiofinal float totalPixels = width heightfinal float totalReqPixelsCap = reqWidth reqHeight 2while (totalPixels (inSampleSize inSampleSize) gt

totalReqPixelsCap) inSampleSize++

return inSampleSize

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

52 Algoritmo di compressione immagini Whatsapp-like 31

523 Risultati ottenuti

Chiunque abbia usato WhatsApp lrsquoapp di messaggistica instantanea piugrave usata almondo1 ha osservato quanto rapidamente le immagini possono essere condiviseanche se sono file di grandi dimensioni Uno degli obiettivi di questo progetto di tesiegrave stato quindi quello di realizzare un algoritmo di compressione immagini che avessedei risultati simili a quelli ottenuti da Whatsapp consentire una rapida tramissionedelle immagini tramite Internet e rendere efficiente lrsquouso dello spazio di memoria adisposizione

Per il confronto sono stati seguiti i seguenti step

bull Le immagini di test in alta risoluzione sono state inviate tramite Whatsapp ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

bull Le immagini di test in alta risoluzione sono state caricate su Art Everywhere ein seguito sono stati estratti i dettagli dellrsquoimmagine (dimensioni risoluzioneecc)

Di seguito vengono illustrati i risultati del confronto tra Art Everywhere (AE) eWhatsapp (WA)

Immagine Risoluzioneoriginale

Dimensione ori-ginale (KB)

Risoluzionecompressa AE

Risoluzionecompressa WA

A1 3526x2645 6031 612x459 1600x1200A2 2560X1440 2580 612x344 1600x900A3 1920x1080 485 612x344 1600x900A4 1600x1066 814 612x407 1600x1066A5 800x600 165 612x459 800x600A6 650x435 145 612x409 650x435

Tabella 52 Confronto sulla risoluzione

Come si puograve notare nella Tabella 52 Art Everywhere procede sempre ad unacompressione della risoluzione (al massimo egrave 612x816) dellrsquoimmagine mantenendocomunque le proporzioni mentre Whatsapp al di sotto di una risoluzione nonprocede alla compressione di essa pur riducendo la dimensione (in KB) dellrsquoimmagine

Nella Tabella 53 vengono confrontati due parametri caratteristici per lacompressione dati il rapporto di compressione e il risparmio di spazio Il primo egravedefinito come il rapporto tra la dimensione compressa e la dimensione originale Ilsecondo egrave definito come la riduzione delle dimensioni rispetto alla dimensione noncompressaCome si puograve notare ad una minore risoluzione dellrsquoimmagine corrisponde unaminore dimensione (in KB) Ciograve fa si che Art Everywhere presenta un maggior

1httpwwwstatistacomstatistics258749most-popular-global-mobile-messenger-apps

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 32

rapporto di compressione comportando cosigrave un maggior risparmio di spazio

Immagine DimensionecompressaAE (KB)

DimensionecompressaWA (KB)

RapportocompressioneAE

RapportocompressioneWA

Risparmiodi spazio()

A1 8924 811 6758 744 9852A2 3893 272 6627 949 9849A3 3081 310 1534 156 9365A4 59 814 1380 1 9275A5 3451 165 478 1 7908A6 5492 145 264 1 6212

Tabella 53 Confronto sui rapporti di compressione

53 Pattern recognition per similaritagrave tra opere drsquoarte

531 Stato dellrsquoarte

In genere egrave facile per una persona differenziare il suono di una voce umana da quelladi un violino un numero ldquo3rdquo scritto a mano da un ldquo8rdquo o ancora lrsquoaroma di unarosa da quello di una cipolla Tuttavia egrave difficile per un computer risolvere questotipo di problemi percettivi Il riconoscimento di pattern viene definito in [10] comela classificazione dei dati di input tramite lrsquoestrazione di features (caratteristiche)importanti da un insieme di dati Consiste quindi nel fare inferenze dai datipercettivi utilizzando strumenti di statistica probabilitagrave geometria computazionalemachine learning e di algorithm design Cosigrave il pattern recognition egrave di fondamentaleimportanza per lrsquointelligenza artificiale e per la visione artificiale e ha applicazioni divasta portata nel campo dellrsquoingegneria della scienza della medicina e del businessIn particolare i progressi realizzati nel corso dellrsquoultimo mezzo secolo ora consentonoai computer di interagire in modo piugrave efficace con gli esseri umani e il mondo naturale

Una feature puograve essere definita come un qualsiasi aspetto distintivo chepuograve essere misurato [3] cioegrave una qualitagrave o una caratteristica che puograve esseresimbolico (ad esempio colore) o numerico (ad esempio altezza) La combinazionedi d features egrave rappresentato come un vettore colonna d-dimensionale detto vettoredelle features Lo spazio d-dimensionale definito dal vettore delle features egrave chiamatospazio delle features Gli oggetti sono rappresentati come punti nello spazio dellefeaturesIl pattern egrave definito come unrsquoentitagrave a cui egrave possibile assegnare un nome [13] Unpattern egrave una coppia di variabili (x w) dove x egrave un insieme di osservazioni o elementi(vettore delle features) e w egrave il concetto dietro lrsquoosservazione ovvero lrsquoetichetta Unpattern potrebbe essere unrsquoimmagine dellrsquoimpronta digitale una parola scritta amano in corsivo o un volto umano

Ci sono due approcci fondamentali per implementare un sistema di patternrecognition statistico e strutturale [6]

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 33

Come mostrato in [4] lrsquoapproccio statistico utilizza concetti della teoria statisticadelle decisioni per discriminare gli oggetti appartenenti a diversi gruppi in base alleloro caratteristiche quantitative Mentre lrsquoapproccio strutturale utilizza grammatichesintattiche per discriminare gli oggetti appartenenti a diversi gruppi in base alle lorocaratteristiche morfologiche

Gli algoritmi utilizzati da sistemi di pattern recognition vengono general-mente divisi in due fasi descrizione e classificazione La fase di descrizionetrasforma i dati raccolti dallrsquoambiente in features che vengono utilizzati nella fasedi classificazione per arrivare a una identificazione La fase di descrizione puogravecomportare diverse seppur correlate attivitagrave

bull pre-elaborazione a volte egrave necessario modificare i dati sia per correggere lecarenze dei dati che per preparare i dati per successive attivitagrave

bull estrazione di features egrave il processo di generazione di features che verrannousate nella fase di classificazione

bull selezione di features riduce il numero di features fornite alla fase diclassificazione

Di queste tre attivitagrave lrsquoestrazione delle features egrave quella piugrave critica poichegraveesse influenzano direttamente lrsquoefficacia della fase di classificazione Per unaclassificazione e quindi unrsquoidentificazione affidabile egrave importante che le featuresestratte dallrsquoimmagine siano rilevabili anche con cambiamenti di scala rumore eilluminazione Per tale motivo Lowe [7] ha presentato un metodo per la generazionedi features da immagini chiamato Scale Invariant Feature Transform (SIFT) Questoapproccio trasforma unrsquoimmagine in una grande collezione di vettori di featureslocali ciascuno dei quali egrave invariante alla traslazione al ridimensionamento e allarotazione dellrsquoimmagine e in parte invariante ai cambiamenti di illuminazione e alleproiezioni 3D I precedenti approcci alla generazione di features locali non eranoinvarianti al ridimensionamento ed erano piugrave sensibili alla distorsione proiettiva e alcambiamento di illuminazione

Un altro possibile metodo per la generazione di features da unrsquoimmagine egraveSpeeded up robust features (SURF) proposto da Bay [2] SURF egrave un rivelatore e undescrittore di punti di interesse in unrsquoimmagine in cui essa viene trasformata incoordinate utilizzando la tecnica piramidale Ovvero lrsquoimmagine viene rappresentataa forma piramidale gaussiana o laplaciana ottenendo lrsquoimmagine con le stessedimensioni ma con larghezza di banda ridotta Questa tecnica garantisce che ipunti di interesse siano invarianti al ridimensionamento

532 Metodo proposto e implementazione

Il sistema di pattern recognition proposto egrave stato realizzato usando il linguaggiodi programmazione Python (216) il web framework Flask (218) che permettedi effettuare richieste RESTful la libreria OpenCV (2110) e la libreria NumPy

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 34

che permette di esprimere immagini come array multidimensionali ed eseguirerapidamente analisi numerica su unrsquoimmagine Il sistema egrave ospitato sul servizio dihosting web PythonAnywhere (219)

Lrsquoobiettivo del sistema proposto egrave quello di confrontare lrsquoimmagine di ricer-ca la cui URL egrave passata come parametro GET e ricercare eventuali corrispondenzee quindi similaritagrave con le opere drsquoarte presenti nel database in modo da individuarefalsi drsquoautore e prevenire eventuali furti di proprietagrave intellettuale

Si definisce la classe CoverDescriptor che trova i punti chiave (keypoints)in unrsquoimmagine e quindi descrive la zona circostante ogni punto chiave utilizzandodescrittori locali invarianti Il costruttore richiede due parametri kpMethod edescMethod Il primo egrave il metodo di rilevamento dei punti chiave Specificandoun valore di SIFT indica che il rilevamento dei punti chiave avviene attraverso ilmetodo ideato da Lowe e presentanto nella sezione 531 Altri valori accettabilisono SURF e ORB Il secondo parametro egrave il descMethod che definisce come vienedescritta lrsquoarea circostante ogni punto chiave Il valore usato egrave SIFT ma possonoessere forniti altri descrittori invarianti locali come SURF ORB BRIEF e FREAKa seconda della versione OpenCV che si sta utilizzando Ersquo importante notare cheSIFT e SURF producono vettori di features con valori reali mentre ORB e BRIEFproducono vettori di features con valori binari Quando si utilizzano descrittori avalori reali come SIFT o SURF si utilizza la distanza euclidea Se i descrittori sonobinari allora si utilizza la distanza di Hamming

Figura 52 Esempio di punti chiave individuati

Per estrarre i punti chiave e i descrittori da unrsquoimmagine viene implementato ilmetodo describe che accetta un solo parametro lrsquoimmagine in cui punti chiavee descrittori devono essere estratti Si rilevano i punti chiave utilizzando lafunzione cv2FeatureDetector_create mentre si estraggono i descrittori dalla regionecircostante ogni punto chiave con la la funzione cv2DescriptorExtractor_create Ilmetodo restituisce una tupla di punti chiave e descrittori corrispondenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 35

class CoverDescriptordef __init__(self kpMethod = SIFT descMethod = SIFT)

store the keypoint detection method and descriptor methodselfkpMethod = kpMethodselfdescMethod = descMethod

def describe(self image) detect keypoints in the imagedetector = cv2FeatureDetector_create(selfkpMethod)kps = detectordetect(image)

extract local invariant descriptors from each keypoint then convert the keypoints to a numpy arrayextractor = cv2DescriptorExtractor_create(selfdescMethod)(kps descs) = extractorcompute(image kps)kps = npfloat32([kppt for kp in kps])

return a tuple of keypoints and descriptorsreturn (kps descs)

La classe CoverMatcher serve per confrontare le diverse immagini Il costruttoreprende due parametri il descrittore (unrsquoistanza di CoverDescriptor) e il percorsodella directory dove sono memorizzate le immagini Il metodo search prende i puntichiave e descrittori dellrsquoimmagine di ricerca e poi le abbina con quelli delle immaginipresenti nel database Per memorizzare i risultati dei confronti viene definito undizionario di risultati la cui chiave egrave il nome dellrsquoimmagine presente nel databasementre il valore saragrave la percentuale dei confronti corrispondente al punto chiave Poisi cicla sulla lista dei percorsi delle immagini presenti nel database Ogni immagineegrave caricata convertita in scala di grigi e quindi vengono estratti i punti chiave edescrittori utilizzando il CoverDescriptor passato al costruttore Il numero di puntichiave corrispondenti egrave quindi determinato utilizzando il metodo match (mostratodi seguito)

class CoverMatcherdef __init__(self descriptor coverPaths)

store the descriptor and image pathsselfdescriptor = descriptorselfcoverPaths = coverPaths

def search(self queryKps queryDescs) initialize the dictionary of resultsresults =

loop over the imagesfor coverPath in selfcoverPaths

load the query image convert it to grayscale and extract keypoints and descriptorscover = cv2imread(coverPath)gray = cv2cvtColor(cover cv2COLOR_BGR2GRAY)(kps descs) = selfdescriptordescribe(gray)

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 36

determine the number of matched inlier keypoints then update the resultsscore = selfmatch(queryKps queryDescs kps descs)results[coverPath] = score

if matches were found sort themif len(results) gt 0

results = sorted([(v k) for (k v) in resultsitems() if v gt 0]reverse = True)

return the resultsreturn results

Il metodo match prende in ingresso 6 parametri

bull kpsA la lista di punti chiave associata alla prima immagine da confrontare

bull featuresA la lista dei vettori di features associata alla prima immagine daconfrontare

bull kpsB la lista di punti chiave associata alla seconda immagine da confrontare

bull featuresB la lista dei vettori di features associata alla seconda immagine daconfrontare

bull ratio il coefficiente della distanza del vicino piugrave prossimo suggerito da Lowe(07) per ridurre il numero di punti chiavi necessari a calcolare unrsquoomografia

bull minMatches il numero minimo di corrispondenze richieste per calcolareunrsquoomografia Il valore scelto egrave 40

Viene poi usata la funzione cv2DescriptorMatcher_create fornendo il valore ldquoBru-teForcerdquo che indica che per confrontare ogni descrittore in featuresA con ognidescrittore in featuresB si utilizza la distanza euclidea Il confronto effettivo vieneeseguito con la funzione knnMatch ldquokNNrdquo sta per ldquoK-Nearest Neighborrdquo dove ildquovicini piugrave prossimirdquo sono definiti dalla piugrave piccola distanza euclidea tra i vettori difeatures Sia featuresA che featuresB sono passati come parametri nella funzioneknnMatch con un terzo parametro fissato a 2 indicando che si vogliono trovare i duevicini piugrave prossimi per ogni vettore di features Il risultato della funzione knnMatchviene memorizzato in rawMatches Vengono poi effettuati due controlli il primo egraveche ci sono effettivamente due confronti il secondo egrave applicare il coefficiente di Lowefacendo in modo che la distanza tra la prima corrispondenza sia inferiore a quelladella seconda corrispondenza Questo test aiuta a rimuovere le false corrispondenzee a rimuovere il numero di punti chiave usati per calcolare lrsquoomografia in modo daaccelerare lrsquointero processo Infine viene assicurato che il numero di corrispondenzesia almeno il numero minimo di corrispondenze (minMatches) Se non ci sonoabbastanza corrispondenze egrave inutile calcolare lrsquoomografia dato che le due immaginiprobabilmente non contegono similaritagrave Viene poi calcolata lrsquoomografia che egraveuna mappatura tra i due piani dei punti chiave con lo stesso centro di proiezioneLrsquoobiettivo egrave quello di determinare le corrispondenze positive distinguendoli daquelli falsi positivi Per fare questo viene usato la funzione cv2findHomography

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 37

e lrsquoalgoritmo RANSAC (Random Sample Consensus) Come definito in [5] egrave unmetodo iterativo per la stima dei parametri di un modello matematico a partire daun insieme di dati contenente outlier Si tratta di un algoritmo nondeterministico nelsenso che produce un risultato corretto solo con una data probabilitagrave che aumentaal crescere delle iterazioni consentiteLa funzione cv2findHomograpy restituisce una tupla di due valori Il primo egrave lamatrice di trasformazione che viene ignorato Il secondo egrave lo status una lista divalori booleani i cui elementi sono settati a 1 se i corrispondenti punti chiave in ptsAe ptsB sono stati abbinati settati a 0 altrimenti Viene poi calcolato il rapporto trail numero di corrispondenze e il numero totale di punti chiave Un punteggio altoindica una migliore corrispondenza tra le due immagini

def match(self kpsA featuresA kpsB featuresB ratio = 07minMatches = 40)

compute the raw matches and initialize the list of actual matchesmatcher = cv2DescriptorMatcher_create(BruteForce)rawMatches = matcherknnMatch(featuresB featuresA 2)matches = []

loop over the raw matchesfor m in rawMatches

ensure the distance is within a certain ratio of each otherif len(m) == 2 and m[0]distance lt m[1]distance ratio

matchesappend((m[0]trainIdx m[0]queryIdx))

check to see if there are enough matches to processif len(matches) gt minMatches

construct the two sets of pointsptsA = npfloat32([kpsA[i] for (i _) in matches])ptsB = npfloat32([kpsB[j] for (_ j) in matches])

compute the homography between the two sets of points and compute the ratio of matched points(_ status) = cv2findHomography(ptsA ptsB cv2RANSAC 40)

return the ratio of the number of matched keypoints to the total number of keypointsreturn float(statussum()) statussize

no matches were foundreturn -10

Infine nello script principale vengono usate le varie classi mostrate finora Vieneinizializzato il database delle immagini su cui effettuare i confronti in cui ogni entryegrave del tipo percorso immagine | titolo opera | autore La chiave del dizionario egrave ilpercorso dellrsquoimmagine mentre i valori sono il titolo e lrsquoautore dellrsquoopera Dopoaver inizializzato le istanze di CoverDescriptor e CoverMatcher si carica lrsquoimmaginedi ricerca la cui URL egrave passata come parametro GET che viene convertita inscala di grigi e da cui vengono estratti i punti chiave e i descrittori locali invarianti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 38

Viene chiamato il metodo search della classe CoverMatcher e se vengono trovatecorrispondenze e quindi similaritagrave con le immagine presenti nel database vieneinviata una mail agli amministratori contenente il titolo dellrsquoopera simile e lapercentuale di similaritagrave

app = Flask(__name__)

initialize the database dictionary of imagesdb = loop over the databasefor l in

csvreader(open(homeFrancescoCucariArtworksRecApistaticcsvimagescsv))db[l[0]] = l[1]

initialize the cover descriptor and cover matchercd = CoverDescriptor()cv = CoverMatcher(cd

globglob(homeFrancescoCucariArtworksRecApicovers + jpg))

approute(rsquosignUprsquo methods=[rsquoGETrsquo])def signUp()

read the posted values from the UI_name = requestargsget(rsquourlrsquo)

validate the received valuesif _name

resp = urlliburlopen(_name)queryImage = npasarray(bytearray(respread()) dtype=uint8)queryImage = cv2imdecode(queryImage cv2IMREAD_COLOR)

gray = cv2cvtColor(queryImage cv2COLOR_BGR2GRAY)(queryKps queryDescs) = cddescribe(gray)

try to match the query image to a known database of imagesresults = cvsearch(queryKps queryDescs)

check to see if no results were foundif len(results) == 0

return I could not find a match for that image otherwise matches were foundelse

loop over the resultsres = for (i (score coverPath)) in enumerate(results)

grab the image information(author title) = db[coverPath[coverPathrfind() + 1]]res += d 2f s - s (i + 1 score 100 author

title)send_mail(_nameres)return res

elsereturn Enter the required fields

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 39

533 Risultati ottenuti

Ersquo possibile provare lrsquoalgoritmo invocando il seguente indirizzo web

httpfrancescocucaripythonanywherecomsignUpurl=value

in cui value egrave lrsquoURL dellrsquoimmagine di ricerca per cui si vogliono cercare corrispon-denze e quindi similaritagrave con una o piugrave opere drsquoarte del database Ogni volta cheuna nuova opera drsquoarte viene caricata su Art Everywhere il backend dopo averlamemorizzata sul proprio spazio di memoria su Picasa fa una richiesta allrsquoindirizzoweb passando come parametro lrsquoURL dellrsquoopera appena caricata

Il database egrave composto dalle opere drsquoarte caricate dagli artisti di Art Eve-rywhere2 e alcune opere famose come La gioconda (A7) e La dama con lrsquoermellino(A8) di Leonardo Da Vinci I girasoli (A9) di Vincent Van Gogh e La nascita diVenere (A10) di Sandro Botticelli

Lrsquoalgoritmo egrave stato testato con alcune immagini di ricerca illustrate in Ap-pendice A trovate in rete e quindi non sono opere caricate dagli artisti registratisulla piattaforma

Testando lrsquoalgoritmo con lrsquoimmagine di ricerca A113 viene rilevata una si-milaritagrave con La gioconda di Leonardo Da Vinci e la percentuale di similaritagraverilevata egrave dellrsquo8298 Nella Figura 53 vengono mostrate le corrispondenze trovatenellrsquoimmagine

Lrsquoimmagine di ricerca A124 egrave ritenuta simile a La gioconda di LeonardoDa Vinci con una percentuale dellrsquo8687 Nella Figura 54 vengono mostrate lecorrispondenze trovate

Figura 53 Risultato test 1Figura 54 Risultato test 2

2al momento della stesura sono 1803Una riproduzione de ldquoLa Giocondardquo in cui la donna tiene in braccio una crostata4LHOOQ di Marcel Duchamp egrave una riproduzione fotografica della Gioconda di Leonardo da

Vinci alla quale sono stati aggiunti provocatoriamente dei baffi e un pizzetto

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

53 Pattern recognition per similaritagrave tra opere drsquoarte 40

Lrsquoimmagine di ricerca A13 egrave considerata un falso drsquoautore de La gioconda diLeonardo Da Vinci Lrsquoalgoritmo ha trovato una similaritagrave con una percentuale del8621 Nella Figura 55 vengono mostrate le corrispondenze trovate

Lrsquoimmagine di ricerca A14 egrave un particolare de La nascita di Venere Lrsquoal-goritmo ha trovato il 9388 di similaritagrave Nella Figura 56 vengono mostrate lecorrispondenze trovate

Figura 55 Risultato test 3

Figura 56 Risultato test 4

Si puograve concludere quindi che il sistema di riconoscimento di pattern ha superato itest effettuati con risultati soddisfacenti Infatti egrave stato in grado di rilevare con altapercentuale di similaritagrave delle corrispondenze tra le immagini di ricerca illustrate ealcune delle opere piugrave famose presenti nel databaseInfine egrave stato effettuato anche un confronto tra le opere drsquoarte caricate dagli artistie non sono state trovate corrispondenze negrave tra loro negrave con le opere famose Quindi egravepossibile concludere che il sistema di pattern recognition proposto egrave stato efficacerispetto allrsquoobiettivo proposto in quanto non ha individuato falsi drsquoautore o furti diproprietagrave intellettuale tra le opere caricate

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

54 Download immagini 41

54 Download immagini

541 Sequence diagram

Figura 57 Sequence Diagram del Download Immagini

Nome Download immaginiAttore Utente

Obiettivo Mostrare le opere drsquoarte caricate dagli artisti in una galleriadal forte impatto visivo

542 Implementazione

Allrsquoavvio dellrsquoapp nellrsquoactivity SplashScreen viene effettuato il controllo dellaconnessione internet Se egrave presente allora viene avviata la richiesta al metodoremoto tramite il metodo endpoint Altrimenti viene mostrato a schermo unmessaggio di errore

SplashScreenjavaprotected void onCreate(Bundle savedInstanceState)

if(isOnline())

DatabaseArtwork db = new DatabaseArtwork(getApplicationContext())dbclear(dbgetWritableDatabase())new DownloadArtworks(getApplicationContext()dbthis)execute()

else

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

54 Download immagini 42

ToastmakeText(getApplicationContext() Connessione internetassente ToastLENGTH_LONG)show()

public boolean isOnline() ConnectivityManager cm = (ConnectivityManager)

getSystemService(ContextCONNECTIVITY_SERVICE)NetworkInfo netInfo = cmgetActiveNetworkInfo()return netInfo = null ampamp netInfoisConnectedOrConnecting()

La classe DownloadArtworks egrave un AsyncTask ovvero una classe di Android che con-sente di effettuare delle elaborazioni in background e mostrarne i risultati sullrsquoUI delthread principale Un task asincrono egrave definito da 3 tipi generici chiamati ParamsProgress e Results e 4 steps chiamati OnPreExecute doInBackground onProgres-sUpdate e OnPostExecute Grazie allrsquointerfaccia TaskCallbackDownloadArtworkschiamando il metodo done() egrave possibile ritornare il controllo al thread principaleInoltre le immagini scaricate vengono salvate nel database locale allrsquoapplicazione

DownloadArtworksjavapublic class DownloadArtworks extends AsyncTaskltInteger Void

MainDownloadResponseCollectiongt Context mContextDatabaseArtwork dbTaskCallbackDownloadArtworks mCallback

public DownloadArtworks(Context context) mContext = context

public DownloadArtworks(Context context DatabaseArtwork dbTaskCallbackDownloadArtworks mCallback)

mContext = contextthisdb = dbthismCallback = mCallback

protected MainDownloadResponseCollection doInBackground(Integerintegers)

Retrieve service handleArtEverywhere apiServiceHandle = AppConstantsgetApiServiceHandle(null)try

ArtEverywhereDisplayGetphotos get =apiServiceHandledisplay()getphotos((long)AppConstantsnumFoto)

MainDownloadResponseCollection greeting = getexecute()return greeting

catch (IOException e)

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

54 Download immagini 43

ToastmakeText(mContext Exception during API callToastLENGTH_LONG)show()

return null

protected void onPostExecute(MainDownloadResponseCollection greeting) if (greeting=null)

int quanteFotoCaricate = greetinggetPhotos()size()for(int i = 0 i lt quanteFotoCaricatei++)String filename = greetinggetPhotos()get(i)getTitle()String photo = greetinggetPhotos()get(i)getUrl()String artista = greetinggetPhotos()get(i)getArtist()String descrizione = greetinggetPhotos()get(i)getDescr()String dimensioni = greetinggetPhotos()get(i)getDim()String luogo = greetinggetPhotos()get(i)getLuogo()String tecnica = greetinggetPhotos()get(i)getTechnique()long likes = greetinggetPhotos()get(i)getLikes()String data = greetinggetPhotos()get(i)getDateTime()

Artwork art = newArtwork(filenamephotoartistadescrizionedimensioniluogotecnicalikesdata)

dbinsert(art dbgetWritableDatabase())mCallbackdone()

else ToastmakeText(mContext No greetings were returned by the API

ToastLENGTH_LONG)show()

La chiamata remota al server egrave effettuata tramite il metodo endpoint contenuto nellalibreria autogenerata e importata nel progetto (come specificato in 212) Vienepassato al metodo il parametro richiesto (in questo caso non egrave obbligatorio) cheindica il numero di immagini che si vogliono scaricare

ArtEverywherejavaprotected Getphotos(javalangLong fetch)

super(ArtEverywherethis GET REST_PATH nullcodcomappspotart_everywhereartEverywheremodelMainDownloadResponseCollectionclass)

thisfetch =comgoogleapiclientutilPreconditionscheckNotNull(fetchRequired parameter fetch must be specified)

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

54 Download immagini 44

Infine viene aggiornata lrsquointerfaccia utente nellrsquoactivity principale MainActivity doveviene visualizzata la galleria con le ultime opere caricate le cui URL sono salvatenellrsquoarray urlPhoto Sono stati utilizzati il componente Android GridView e lalibreria Picasso presentata nella sezione 543

MainActivityjavaprotected void onCreate(Bundle savedInstanceState)

gridview = (GridView) findViewById(RidgridView)gridviewsetAdapter(new ImageAdapter(this))

gridviewsetOnItemClickListener(new AdapterViewOnItemClickListener() Overridepublic void onItemClick(AdapterViewltgt parent View view int position

long id) Intent intent = new Intent(MainActivitythis ArtworkDetailsclass)String url = urlPhoto[position]intentputExtra(photourl)startActivity(intent)

)

private class ImageAdapter extends BaseAdapter private Context mContext

public ImageAdapter(Context context) mContext=contextOverridepublic View getView(int position View convertViewViewGroup parent)

ImageView imageViewcheck to see if we have a viewif (convertView == null) no view - so create a new oneimageView = new ImageView(mContext) else use the recycled view objectimageView = (ImageView) convertView

DisplayMetrics metrics = new DisplayMetrics()getWindowManager()getDefaultDisplay()getMetrics(metrics)int size = metricswidthPixels

Picassowith(MainActivitythis)load( + urlPhoto[position] + )error(Rrawplace_holder)noFade()resize(size2 size2)centerCrop()

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

54 Download immagini 45

into(imageView)return imageView

543 Aspetti particolari

Una particolaritagrave molto importante nellrsquoimplementazione del metodo per il downloaddelle immagini egrave stata lrsquoutilizzo della libreria Picasso5 Essa egrave una potente libreriaper il download e il caching delle immagini Inoltre si occupa in modo efficientedel riciclo delle ImageView e del download negli ImageAdapter e di complessetrasformazioni di immagini con il minimo utilizzo di memoria Infine Picasso egravemolto utile nel caching delle immagini Il caricamento di una singola immaginenellrsquointerfaccia utente egrave semplice ma le cose si fanno piugrave complicate se egrave necessariocaricare un insieme piugrave ampio di immagini contemporaneamente Picasso utilizzauna memoria cache per migliorare la reattivitagrave e fluiditagrave dellrsquointerfaccia utentedurante il caricamento di piugrave immagini

In maniera simile al metodo proposto nella sezione precedente vengono im-plementati i metodi che rendono possibile filtrare la ricerca delle opere drsquoarteInnanzittutto viene fatto un controllo sulla connessione internet disponibile Nelcaso in cui non ci siano problemi di connessione viene invocato lrsquoAsyncTask specificoDownloadArtworksByTechnique DownloadArtworksByPlace o DownloadArtistFor-Gallery Il primo si occupa di invocare il metodo remoto in modo da far ritornarelrsquoelenco delle opere drsquoarte riferite alla tecnica scelta dallrsquoutente da un menugrave ad hocSimilmente il secondo ritorna lrsquoelenco delle opere drsquoarte riferite al luogo (cittagrave)digitata dallrsquoutente nel menugrave apposito In entrambi i casi la lista ritornata vienedinamicamente aggiornata nella griglia della galleria grazie alla libreria Picasso e alcomponente ImageAdapter Cliccando sullrsquoopera drsquoarte di interesse viene avviatalrsquoactivity che fa visualizzare i dettagli di essa (ArtworksDetailsjava) Il terzo invecesi occupa di invocare il metodo remoto in modo da far ritornare lrsquoelenco degliartisti registrati sulla piattaforma Cliccando sullrsquoartista di interesse viene avviatalrsquoactivity che fa visualizzare il profilo dellrsquoartista (ArtistProfilejava)

5httpsquaregithubiopicasso

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

46

Capitolo 6

Distribuzione e Validazione

In questo capitolo vengono date indicazioni su come distribuireinstallare lrsquoap-plicazione e si descrive come egrave stata effettuata la validazione e la fase di testdellrsquoapplicazione

61 Installazione applicazioneIn vista della terza milestone (231) in particolare il 22 Marzo 2015 egrave statapubblicata lrsquoapplicazione sul Play Store e oggi1 conta circa 350 downloadPer poter installare lrsquoapplicazione egrave necessario avere un account Google ossia unindirizzo Gmail e che questrsquoultimo sia associato al proprio smartphone o tabletAndroid Poi bisogna accedere al Play Store e cercare lrsquoapp Art Everywhere2Nella schermata che compare egrave necessario pigiare prima sul pulsante Installa(Figura 61) che si trova in alto a destra e poi sul pulsante Accetto (Figura 62)per visualizzare i permessi della app (ossia vedere su quali componenti del sistemaagisce) accettare le sue condizioni di utilizzo e scaricarla sul proprio dispositivoAl termine dellrsquoinstallazione lrsquoapplicazione compariragrave nella lista delle applicazioni(Figura 63) installate nel dispositivo e potragrave essere usata in qualsiasi momento

Figura 61 Figura 62 Figura 63

1al momento della stesura2httpsplaygooglecomstoreappsdetailsid=comarteverywherefrancescoart

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

62 Validazione 47

62 ValidazioneAbbiamo dato molta importanza al coinvolgimento dei potenziali utenti nel processodi sviluppo dellrsquoapplicazione Infatti Art Everywhere egrave stata sviluppata utilizzandoun approccio partecipativo e centrato sugli utenti A tal proposito abbiamo effettuatounrsquoampia valutazione dellrsquousabilitagrave del sistema con corrispondenti miglioramenti dellaprogettazione Il feedback con gli utenti egrave stato continuo ed egrave servito a migliorarealcuni aspetti funzionali dellrsquointero sistema Ersquo stato usato lrsquoapproccio user-centereddesign per un miglioramento costante dellrsquousabilitagrave dellrsquoapplicazione Questa sezionemostra nel dettaglio la validazione utilizzata e i risultati ottenuti

621 User-Centered Design

La progettazione di oggetti e di strumenti come lrsquointerfaccia di unrsquoapplicazione o diun sito web non egrave sempre intuitiva e a volte rende lrsquoutente frustrato e incapace dicompiere semplici compiti Molto spesso infatti i sistemi sono progettati con unaparticolare attenzione agli obiettivi di business o alle caratteristiche tecnologichedellrsquohardware o del software (Technology-Centered Design) Questi approcci allaprogettazione del sistema omettono perograve la parte piugrave importante del processoovvero lrsquoutente finale [1]La progettazione centrata sullrsquoutente o in inglese User-Centered Design (UCD) egraveuna filosofia di progettazione in cui viene data grande attenzione in ogni fase delprocesso di progettazione alle esigenze ai bisogni e alle limitazioni degli utenti finalidi un prodotto servizio o processoLa differenza principale da altre filosofie di progettazione del prodotto egrave che UCDcerca di ottimizzare il prodotto in base a ciograve che gli utenti possono vogliono onecessitano di utilizzare piuttosto che costringere gli utenti a cambiare il lorocomportamento per usare il prodotto Come specificato in [12] ciograve non significachiedere agli utenti cosa vogliono e in seguito darglielo ma il coinvolgimento degliutenti assicura che il prodotto saragrave adatto per lo scopo previsto Questo approccioporta allo sviluppo di prodotti che sono piugrave efficaci ed efficienti

In una prima fase della progettazione del sistema (Gennaio 2015) egrave stata difondamentale importanza lrsquoindividuazione dei possibili utenti della piattaforma Ciograveegrave stato reso possibile tramite dei sondaggi pubblicati su alcuni gruppi tematicisu Facebook che ci hanno permesso di stabilire il background (etagrave abitudini ecc)degli utenti Gli utenti coinvolti sono stati 59 Agli stessi egrave stata sottopostaunrsquointervista per individuare le loro aspettative e le loro esigenze La maggior partedei suggerimenti e le esigenze richieste sono state prese in considerazione nellosviluppo del sistema

Al termine della fase di progettazione dellrsquoapplicazione (ultima settimana diMarzo) egrave stata condotta unrsquointervista su un campione di 20 utenti registrati sullapiattaforma con lo scopo di ottenere dati sullrsquousabilitagrave dellrsquoapplicazione Lrsquoobiettivoegrave stato quello di realizzare unrsquointerfaccia user-friendly ovvero facile da impararecoinvolgente da utilizzare e che supporta le attivitagrave degli utenti in modo efficace Inbase ai risultati del sondaggio possiamo concludere che lrsquoobiettivo egrave stato raggiunto

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

62 Validazione 48

Ersquo stato utilizzato Survio3 un software online per creare gratuitamente questionarie sondaggi I questionari sottoposti e le relative risposte sono presentati in 622

622 Risultati sondaggi

Sondaggio sul background degli utenti

Domanda 1 Quanti anni hai

Figura 64 Risultati domanda 1

Domanda 2 Seleziona la frase che ti identifica di piugrave

Figura 65 Risultati domanda 2

Domanda 3 Hai mai utilizzato un social network per condividere epromuovere i tuoi lavori

Figura 66 Risultati domanda 3

3httpwwwsurviocom

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

62 Validazione 49

Domanda 4 Se la risposta alla domanda 3 egrave NO perchegrave (risposta aperta)

Figura 67 Risultati domanda 4

Domanda 5 Se la risposta alla domanda 3 egrave SI quali social network haiusasto

Figura 68 Risultati domanda 5

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

62 Validazione 50

Sondaggio sulle aspettative degli utenti

Domanda 1 Nel momento in cui carichi una foto di una tua opera drsquoartequali informazioni vorresti aggiungere Selezionare una o piugrave risposte

Figura 69 Risultati domanda 1

Domanda 2 cosa credi sia piugrave importante avere nella pagina del proprioprofilo personale oltre alle informazioni di base (Nome Cognome Etagraveecc) Selezionare una o piugrave risposte

Figura 610 Risultati domanda 2

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

62 Validazione 51

Domanda 3 Quali sono gli aspetti piugrave importanti che unrsquoapplicazionededicata agli artisti dovrebbe presentare Ordinarli per prioritagrave

Figura 611 Risultati domanda 3

Domanda 4 Come ti piacerebbe che fossero valutate le tue opere

Figura 612 Risultati domanda 4

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

62 Validazione 52

Domanda 5 Quale tipologia di pubblico vorresti raggiungere

Figura 613 Risultati domanda 5

Domanda 6 Quanto egrave importante per te la condivisione dei tuoi lavori ar-tistici sui social network per farti conoscere rispetto ai modi tradizionali(mostreecc)

Figura 614 Risultati domanda 6

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

62 Validazione 53

Test sullrsquousabilitagrave

Domanda 1 Come giudichi la facilitagrave di utilizzo dellrsquoapplicazione

Figura 615 Risultati domanda 1

Domanda 2 Come valuti lrsquoefficienza dellrsquoupload delle tue opere drsquoarte

Figura 616 Risultati domanda 2

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

62 Validazione 54

Domanda 3 Quanto ti piacciono lo stile e il tema dellrsquoapplicazione

Figura 617 Risultati domanda 3

Domanda 4 Come giudichi la modalitagrave in cui vengono presentate le tueopere su Art Everywhere

Figura 618 Risultati domanda 4

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

55

Appendice A

Appendice Immagini

A1 Immagini per test di compressioneIn questa sezione sono illustrate le immagini usate per testare lrsquoalgoritmo dicompressione presentato nella sezione 52

Figura A1Figura A2 Figura A3

Figura A4 Figura A5 Figura A6

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

A2 Opere drsquoarte 56

A2 Opere drsquoarteIn questa sezione sono illustrate le opere drsquoarte famose presenti nel database usateper individuare la similaritagrave con le opere caricate dagli utenti (53)

Figura A7 La Gioconda - Leonardo daVinci

Figura A8 La dama con lrsquoermellino -Leonardo da Vinci

Figura A9 I girasoli - Vincent Van Gogh

Figura A10 La nascita di Venere - SandroBotticelli

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

A3 Immagini di ricerca 57

A3 Immagini di ricercaIn questa sezione sono illustrate le immagini delle opere usate per testare lrsquoalgoritmodi pattern recognition (53) per individuare eventuali similaritagrave con le opere drsquoartefamose e le opere caricate dagli artisti registrati sulla piattaforma

Figura A11 Copia La Gioconda

Figura A12 Copia La Gioconda

Figura A13 Copia La Gioconda Figura A14 Particolare La nascita diVenere

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

58

Ringraziamenti

Giunto alla conclusione di questo lavoro egrave doveroso ringraziare tutte le persone chemi hanno permesso di raggiungere questo primo importante traguardo della miacarriera universitaria

Un ignaro lettore potrebbe pensare che dopo aver scritto una tesi indipen-dentemente dalla sua qualitagrave scrivere qualche riga di ringraziamenti sia qualcosadi semplice e immediato e sinceramente anchrsquoio la pensavo cosigrave Bene misbagliavo Quelle poche persone che prenderanno in mano questo tomo infattiquasi sicuramente finiranno a leggere queste righe non per chissagrave quale motivo mapercheacute probabilmente sono le uniche cose realmente comprensibili anche a chi nonha frequentato il mio corso di laurea

Un primo ringraziamento va ovviamente ai miei genitori Mario e Rosannaper i valori che mi hanno insegnato e per avermi dato tutto il necessario supportomateriale e morale per raggiungere i risultati prefissati

Un grazie sincero ai miei fratelli Giovanni e Nicola che in questi anni dildquoconvivenzardquo romana non mi hanno mai fatto mancare nulla e che mi stimolano araggiungere sempre nuovi traguardi

Un ringraziamento particolare va al gruppo di Art Everywhere Davide Fa-brizio Sara e Simone con i quali abbiamo vissuto in questi mesi momenti disconforto in particolare quando le cose non andavano per il giusto verso masoprattutto momenti di grande soddisfazione per i risultati ottenuti e di orgoglio peraver trasformato una semplice idea abbozzata su una lavagna in una ldquosolida realtagraverdquo

Desidero ringraziare il mio relatore prof Stefano Leonardi per avermi da-to la possibilitagrave di realizzare questa tesi

Infine un ultimo ringraziamento va a me stesso e alla mia determinazioneche come direbbe Goethe mi ha portato a raggiungere questo traguardo ldquosenzafretta ma senza sostardquo Mi auguro di raggiungere nuovi importanti e gratificantitraguardi nella mia vita

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti

59

Bibliografia

[1] Abras C Maloney-Krichmar D Preece J User-centered design Bainbrid-ge W Encyclopedia of Human-Computer Interaction Thousand Oaks SagePublications 37(4) 445ndash456 (2004) (Citato a pagina 47)

[2] Bay H Tuytelaars T Van Gool L Surf Speeded up robust features InComputer visionndashECCV 2006 pp 404ndash417 Springer (2006) (Citato a pagina 33)

[3] Bishop C Pattern recognition and machine learning (Citato a pagina 32)

[4] Duda RO Hart PE Stork DG Pattern classification John Wiley amp Sons(2012) (Citato a pagina 33)

[5] Fischler MA Bolles RC Random sample consensus a paradigm formodel fitting with applications to image analysis and automated cartographyCommunications of the ACM 24(6) 381ndash395 (1981) (Citato a pagina 37)

[6] Goldfarb L A unified approach to pattern recognition Pattern Recognition17(5) 575ndash582 (1984) (Citato a pagina 32)

[7] Lowe DG Object recognition from local scale-invariant features In Computervision 1999 The proceedings of the seventh IEEE international conference onvol 2 pp 1150ndash1157 Ieee (1999) (Citato a pagina 33)

[8] Pensiri F A lossless image compression algorithm using predictive codingbased on quantized colors PhD thesis National Institute of DevelopmentAdministration (2011) (Citato a pagina 28)

[9] Rafael C Gonzalez REW Digital Image Processing 2nd edition (Citato allepagine 27 and 28)

[10] Rafael C Gonzaacutelez MGT Syntactic Pattern Recognition An Introduction(Citato a pagina 32)

[11] Vairagade RS Kulkarni R Image compression algorithm using predictivecoding based on color quantization for android mobile devices (2014) (Citato apagina 28)

[12] Vredenburg K Isensee S Righi C Design UC An integrated approachPrentice Hall Englewood Cliffs (2001) (Citato a pagina 47)

[13] Watanabe S Pattern Recognition Human and Mechanical (Citato apagina 32)

  • Introduzione
  • Requisiti
    • Specifica dei requisiti
    • Screenshots delle principali funzionalitagrave
      • Tecnologie e metodologie usate
        • Tecnologie in uso
          • Google App Engine
          • Google Cloud Endpoints
          • Google Cloud Datastore
          • Picasa Web Albums Data API
          • Android
          • Python
          • OAuth 20
          • Flask
          • PythonAnywhere
          • OpenCV
            • Tecnologie abbandonate
              • Google BlobStore API
              • Google Cloud Storage
                • Metodologia utilizzata ed organizzazione del lavoro
                  • Milestones
                  • Divisione del lavoro
                  • Tool utilizzati
                      • Analisi concettuale del sistema
                        • Modello Entitagrave-Relazioni
                          • Vincoli non esprimibili nello schema
                          • Glossario delle entitagrave e delle relazioni
                          • Ristrutturazione dello schema ER
                            • Use Case Diagram
                              • Carica opera darte
                              • Ricerca opera darte
                              • Visualizza galleria delle opere
                                  • Progettazione del sistema
                                    • Architettura del sistema
                                    • Progettazione logica del data layer
                                      • Schema logico dei dati
                                      • Ristrutturazione dello schema logico
                                          • Realizzazione del sistema
                                            • Upload immagini
                                              • Sequence diagram
                                              • Implementazione
                                              • Aspetti particolari
                                                • Algoritmo di compressione immagini Whatsapp-like
                                                  • Stato dellarte
                                                  • Metodo proposto e implementazione
                                                  • Risultati ottenuti
                                                    • Pattern recognition per similaritagrave tra opere darte
                                                      • Stato dellarte
                                                      • Metodo proposto e implementazione
                                                      • Risultati ottenuti
                                                        • Download immagini
                                                          • Sequence diagram
                                                          • Implementazione
                                                          • Aspetti particolari
                                                              • Distribuzione e Validazione
                                                                • Installazione applicazione
                                                                • Validazione
                                                                  • User-Centered Design
                                                                  • Risultati sondaggi
                                                                      • Appendice Immagini
                                                                        • Immagini per test di compressione
                                                                        • Opere darte
                                                                        • Immagini di ricerca
                                                                          • Ringraziamenti