-
Notifications
You must be signed in to change notification settings - Fork 0
/
PWBD_old.html
785 lines (703 loc) · 46 KB
/
PWBD_old.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>Wanted! - Project Work Design Brief</title>
<meta content="Wanted!" name="description">
<meta content="Art, Photograph, Pets, Love, Memories" name="keywords">
<!-- Favicons -->
<link href="assets/img/favicon.png" rel="icon">
<link href="assets/img/apple-touch-icon.png" rel="apple-touch-icon">
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,500,500i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i" rel="stylesheet">
<!-- Vendor CSS Files -->
<link href="assets/vendor/aos/aos.css" rel="stylesheet">
<link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
<link href="assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
<link href="assets/vendor/glightbox/css/glightbox.min.css" rel="stylesheet">
<link href="assets/vendor/remixicon/remixicon.css" rel="stylesheet">
<link href="assets/vendor/swiper/swiper-bundle.min.css" rel="stylesheet">
<!-- Template Main CSS File -->
<link href="assets/css/style.css" rel="stylesheet">
<!-- =======================================================
* Template Name: Gp - v4.7.0
* Template URL: https://bootstrapmade.com/gp-free-multipurpose-html-bootstrap-template/
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
======================================================== -->
</head>
<body>
<!-- ======= Header ======= -->
<header id="header" class="fixed-top header-inner-pages">
<div class="container d-flex align-items-center justify-content-lg-between">
<h1 class="logo me-auto me-lg-0"><a href="index.html">WANTED<span>!</span></a></h1>
<!-- Uncomment below if you prefer to use an image logo -->
<!-- <a href="index.html" class="logo me-auto me-lg-0"><img src="assets/img/logo.png" alt="" class="img-fluid"></a>-->
<nav id="navbar" class="navbar order-last order-lg-0">
<ul>
<li><a class="nav-link scrollto active" href="index.html#hero">Home</a></li>
<li><a class="nav-link scrollto" href="index.html#about">About</a></li>
<li class="dropdown"><a href=""><span>Project Work Design Brief</span> <i class="bi bi-chevron-down"></i></a>
<ul>
<li class="dropdown"><a href="#Intro"><span>Introduction</span> <i class="bi bi-chevron-right"></i></a>
<ul>
<li class="dropdown"><a href="#Context">The Context</a>
<ul>
<li><a href="#">Reference institution and assets</a></li>
<!--li><a href="#">b) relevant CH assets</a></li-->
<li><a href="#">The location</a></li>
<li><a href="#">The target audience</a></li>
</ul>
</li>
<li class="dropdown"><a href="#Concept">The Concept</a>
<ul>
<li><a href="#">Conceptual map</a></li>
<li><a href="#">The museological approach</a></li>
<li><a href="#">Experience design</a></li>
<li><a href="#">Specific CH topic selected as case study</a></li>
<li><a href="#">Chosen cognitive focus</a></li>
</ul>
</li>
<li><a href="#Goals">The Goals</a></li>
<li><a href="#Requirements">The Requirements</a></li>
</ul>
</li>
<li class="dropdown"><a href="#Dev"><span>Development</span> <i class="bi bi-chevron-right"></i></a>
<ul>
<li><a href="#">The story</a></li>
<li><a href="#ID">Interaction Diagram</a></li>
<li><a href="#">c) Development to reach the cognitive focus</a></li>
<li><a href="#">d) Foreseen workflow (includes needed software, hardware, professionals)</a></li>
<li><a href="#">e) Further development and maintenance issues</a></li>
</ul>
</li>
<li><a href="#team">Teams roles</a></li>
<li><a href="#Bib">Bibliography</a></li>
<li class="dropdown"><a href="#Complementary"><span>Complementary Material for the Discussion</span> <i class="bi bi-chevron-right"></i></a>
<!--ul>
<li><a href="#">3d object or scene (3D)</a></li>
<li><a href="#"> Trailer (video)</a></li>
<li><a href="#"> Audio (i.e. interviews of your potential users)</a></li>
</ul-->
</li>
</ul>
</li>
<!--li><a class="nav-link scrollto" href="stories.html">Services</a></li>
<li><a class="nav-link scrollto " href="index.html#portfolio">Portfolio</a></li-->
<li><a class="nav-link scrollto" href="#team">Team</a></li>
<li><a class="nav-link scrollto" href="index.html#contact">Contact</a></li>
</ul>
<i class="bi bi-list mobile-nav-toggle"></i>
</nav><!-- .navbar -->
<a href="in_art.html" class="get-started-btn scrollto">The exhibit</a>
</div>
</header><!-- End Header -->
<main id="main">
<!-- ======= Breadcrumbs ======= -->
<section class="breadcrumbs">
<div class="container">
<div class="d-flex justify-content-between align-items-center">
<h2>Project Work Brief Description</h2>
<ol>
<li><a href="index.html">Home</a></li>
<li>Project Work Brief Description</li>
</ol>
</div>
</div>
</section><!-- End Breadcrumbs -->
<section class="inner-page">
<!-- ======= Intro Section ======= -->
<div class="container" id="Intro">
<div class="accordion" id="IntroA">
<div class="accordion-item">
<h2 class="accordion-header" id="headingOne">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Introduction
</button></h2>
<div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
<div class="accordion-body">
<p><strong class="title">Wanted!</strong> is a project that have been inspired by a corpus of <cite>lost-pets-advertisements</cite> photographs collected over the years in various places and it is focused on the complex relationship between humans and their pets in an anti-specistic view of interpersonal relationship and family's bounds.</br>
The name obviously comes from the strong visual relationship of these sos-flyers with the <cite>Old West</cite> bandit bans.</br>
The website is conceived as a multi-dimensional cultural environment offering different paths to be explored such as a <strong>current virtual exhibition</strong>, a growing <strong>souvenir-book</strong> built from users interaction and some <strong>data-visualization</strong>.
</p>
<p>The fascination for the affective and memorial effect of these images prompted us to think about the creation of a virtual space that would allow the preservation of the memory of these beloved ones - most of them no longer found - through the telling and sharing of their stories, with the intent of arousing emotions such as memory, empathy, sympathy and socializing the pain of a loss or the joy of a happy ending.</br>
At the same time, the project would also like to become a support tool in the search for the animal in the early stages of its disappearance, through the possibility of directly publishing the loss announcements accompanied by geolocation data. Each user can have the option to upload and share their own story or simply link that of others.</br>
In addition to the suggestion of the user's emotional-cognitive aspect, the project also wants to provide an informative contribution, presenting some stories, works, performances of artists who have wanted to consecrate their emotional ties with their animal.
</p>
</div>
</div>
</div>
<div class="container" id="Context">
<div class="accordion" id="ContextA">
<div class="accordion-item">
<h2 class="accordion-header" id="headingOne">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
The Context
</button></h2>
<div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
<div class="accordion-body">
<div class="row">
<div class="container col-lg-6 col-md-6" id="RI">
<h5>Reference institutions with its institutional goals<!--/(include raster images or/and panoramas)--></h5>
<p>When we started thinking about this project, as said inspired by a self-collected corpus of photographs, which a sample is in the <a href="index.html#preliminary_data">Preliminary data section</a>, the first visual references we thought about had been <strong>memorials</strong> museums and installations such as the <a href="https://www.museomemoriaustica.it/il-museo/" target="_blank">Museo per la Memoria di Ustica</a> - hosting a Boltanski work, artist specially devoted to memory and memorial issues - or the initially spontaneous <a href="https://www.storiaememoriadibologna.it/sacrario-partigiani-in-piazza-nettuno-a-bologna-892-opera" target="_blank">Sacrario partigiani in Piazza Nettuno a Bologna</a> - to mention two Bologneses exaples - or the Argentinian <a href="https://apm.gov.ar/apm/portada" target="_blank">Archivo Provincial de la Memoria/Ex D2</a>.
All these insitutions are devoted to preserve the public testimony of historical facts as well as to celebrate the intimate memory of missed beloved-ones.</br>
Although, we soon realized that, even if a strong memorial component was present in our inspirational material, we would also find the way to celebrate the <strong>joyful</strong> part of the relationship with the - hopefully momentaneously - lost pets.</p>
<p>For this part we explored some examples such as those mentioned by Simona Caraceni in her Mewselogy course slides
(Hermitage cats army guards, <a href="https://bigcomicbros.net/work/6195/" target="_blank">Le chat du Louvre</a>,
<a href="http://catsmuseum.org/" target="_blank">Cat Museum Kotor</a> and Cats Museum Malaysia):
even these references have not been satisfying for our intents, because these museums often celebated single pets,
or a special kind of pets (dogs, cats, etc.) while we were looking for an institution exploring the complex emotive human-pet
relationship "species-indipendent".</p>
<p>We then realized the <a href="in_art.html">In Art</a> section, conceived as a virtual exhibition about this topic: the idea,
involving famous visual artists, is to achieve the double goal of humanising the artist and making their emotive world closer to that of the user.
We then choose some artists and their pets such as <strong>Frida Kahlo and Granizo</strong>,
<strong>Henry Matisse and Minouche</strong>, <strong>Giosetta Fioroni and Biri</strong> etc.</p>
<p>The overall context will be then possibly a physical museum hosting a temporary physical exhibiton on humans and artist
and their pets relationship, that offers also the possibility to the visitors of having an online introduction
- <a href="">In History</a> section - a further online exploration of the artists-pets relationship with contents
not physically available in the museum - <a href="in_art.html">In Art</a> section -
an interactive part where loading and sharing their personal stories - <a href="index.html#portfolio">Your Stories</a> section
- and possibly a tool able to help proactively people loosing their pets by visualizing geolocated shared data of missing pets
- <a href="">Data</a> section.</p>
<p><b>PUT "DEFINE INST GOALS CARDS".</b></p>
</div>
<div class="container col-lg-6 col-md-6">
<img src="https://www.storiaememoriadibologna.it/imageserver/gallery_big/files/vecchio_archivio/seconda-guerra/d/D18250_174.jpg" class="img-fluid" alt="Sacrario. Bologna 1945 o 1946. Il Sacrario dei caduti della Resistenza in Piazza del Nettuno a Bologna. Credits Istituzione Bologna Musei" title="Sacrario. Bologna 1945 o 1946. Il Sacrario dei caduti della Resistenza in Piazza del Nettuno a Bologna. Credits Istituzione Bologna Musei">
<figcaption>Sacrario. Bologna 1945 o 1946. Il Sacrario dei caduti della Resistenza in Piazza del Nettuno a Bologna. Credits <a href="https://www.storiaememoriadibologna.it/crediti" target="_blank">Istituzione Bologna Musei</a></figcaption></br>
<iframe src="in_art.html" width="100%" height="400vh"></iframe>
<figcaption>Virtual exhibition on artist-pet relationships</a></figcaption></br>
</div>
<p><b>PUT "PACT FRAMEWORK".</b></p>
</div>
</div>
<div class="container">
<h5>Relevant assets <!--(include raster images or/and panoramas)--></h5>
<p><b>PUT "DEFINE THE CONTEXT CARDS".</b></p>
<h5>The target audience <!--(with characteristics, motivations, capabilities and devices)Personae e altro--></h5>
<p><b>PUT "PERSONAE".</b></p>
<h5>The location <!--(in case of on-site application it will be the museum or monument)--></h5>
<p>As already mentioned, even if a museum could be physically existent, our application is thought to be suitable also to be used totally online, and accordin to ??? (Beltramini and Gaiani, 2012: 60). and thus we can use to define it these two cathegories:</br>
<ul>
<ol>4.Virtual with real: in this category the researchers have identified a type of virtual museum that they define as a digital space built with the use of technology. This virtual space can shape a real space or an ideal space shaped for virtual exhibition. What identifies the virtual museum is that the objects shown are real objects that have been digitalised for display in a virtual space to be better studied or browsed.</ol>
<ol>5.Virtual with virtual: this last category covers museums with digital spaces that do not exist in reality, and where the objects are also born in digital space (they do not exist in real world), and are created only for the museum. That is to say a completely virtual museum, according to this classification.</ol>
</ul>
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container" id="Context">
<h4>The Context</h4>
<div class="row">
<div class="container col-lg-6 col-md-6" id="RI">
<h5>Reference institutions with its institutional goals<!--/(include raster images or/and panoramas)--></h5>
<p>When we started thinking about this project, as said inspired by a self-collected corpus of photographs, which a sample is in the <a href="index.html#preliminary_data">Preliminary data section</a>, the first visual references we thought about had been <strong>memorials</strong> museums and installations such as the <a href="https://www.museomemoriaustica.it/il-museo/" target="_blank">Museo per la Memoria di Ustica</a> - hosting a Boltanski work, artist specially devoted to memory and memorial issues - or the initially spontaneous <a href="https://www.storiaememoriadibologna.it/sacrario-partigiani-in-piazza-nettuno-a-bologna-892-opera" target="_blank">Sacrario partigiani in Piazza Nettuno a Bologna</a> - to mention two Bologneses exaples - or the Argentinian <a href="https://apm.gov.ar/apm/portada" target="_blank">Archivo Provincial de la Memoria/Ex D2</a>.
All these insitutions are devoted to preserve the public testimony of historical facts as well as to celebrate the intimate memory of missed beloved-ones.</br>
Although, we soon realized that, even if a strong memorial component was present in our inspirational material, we would also find the way to celebrate the <strong>joyful</strong> part of the relationship with the - hopefully momentaneously - lost pets.</p>
<p>For this part we explored some examples such as those mentioned by Simona Caraceni in her Mewselogy course slides
(Hermitage cats army guards, <a href="https://bigcomicbros.net/work/6195/" target="_blank">Le chat du Louvre</a>,
<a href="http://catsmuseum.org/" target="_blank">Cat Museum Kotor</a> and Cats Museum Malaysia):
even these references have not been satisfying for our intents, because these museums often celebated single pets,
or a special kind of pets (dogs, cats, etc.) while we were looking for an institution exploring the complex emotive human-pet
relationship "species-indipendent".</p>
<p>We then realized the <a href="in_art.html">In Art</a> section, conceived as a virtual exhibition about this topic: the idea,
involving famous visual artists, is to achieve the double goal of humanising the artist and making their emotive world closer to that of the user.
We then choose some artists and their pets such as <strong>Frida Kahlo and Granizo</strong>,
<strong>Henry Matisse and Minouche</strong>, <strong>Giosetta Fioroni and Biri</strong> etc.</p>
<p>The overall context will be then possibly a physical museum hosting a temporary physical exhibiton on humans and artist
and their pets relationship, that offers also the possibility to the visitors of having an online introduction
- <a href="">In History</a> section - a further online exploration of the artists-pets relationship with contents
not physically available in the museum - <a href="in_art.html">In Art</a> section -
an interactive part where loading and sharing their personal stories - <a href="index.html#portfolio">Your Stories</a> section
- and possibly a tool able to help proactively people loosing their pets by visualizing geolocated shared data of missing pets
- <a href="">Data</a> section.</p>
<p><b>PUT "DEFINE INST GOALS CARDS".</b></p>
</div>
<div class="container col-lg-6 col-md-6">
<img src="https://www.storiaememoriadibologna.it/imageserver/gallery_big/files/vecchio_archivio/seconda-guerra/d/D18250_174.jpg" class="img-fluid" alt="Sacrario. Bologna 1945 o 1946. Il Sacrario dei caduti della Resistenza in Piazza del Nettuno a Bologna. Credits Istituzione Bologna Musei" title="Sacrario. Bologna 1945 o 1946. Il Sacrario dei caduti della Resistenza in Piazza del Nettuno a Bologna. Credits Istituzione Bologna Musei">
<figcaption>Sacrario. Bologna 1945 o 1946. Il Sacrario dei caduti della Resistenza in Piazza del Nettuno a Bologna. Credits <a href="https://www.storiaememoriadibologna.it/crediti" target="_blank">Istituzione Bologna Musei</a></figcaption></br>
<iframe src="in_art.html" width="100%" height="400vh"></iframe>
<figcaption>Virtual exhibition on artist-pet relationships</a></figcaption></br>
</div>
<p><b>PUT "PACT FRAMEWORK".</b></p>
</div>
</div>
<div class="container">
<h5>Relevant assets <!--(include raster images or/and panoramas)--></h5>
<p><b>PUT "DEFINE THE CONTEXT CARDS".</b></p>
<h5>The target audience <!--(with characteristics, motivations, capabilities and devices)Personae e altro--></h5>
<p><b>PUT "PERSONAE".</b></p>
<h5>The location <!--(in case of on-site application it will be the museum or monument)--></h5>
<p>As already mentioned, even if a museum could be physically existent, our application is thought to be suitable also to be used totally online, and accordin to ??? (Beltramini and Gaiani, 2012: 60). and thus we can use to define it these two cathegories:</br>
<ul>
<ol>4.Virtual with real: in this category the researchers have identified a type of virtual museum that they define as a digital space built with the use of technology. This virtual space can shape a real space or an ideal space shaped for virtual exhibition. What identifies the virtual museum is that the objects shown are real objects that have been digitalised for display in a virtual space to be better studied or browsed.</ol>
<ol>5.Virtual with virtual: this last category covers museums with digital spaces that do not exist in reality, and where the objects are also born in digital space (they do not exist in real world), and are created only for the museum. That is to say a completely virtual museum, according to this classification.</ol>
</ul>
</p>
</div>
<div class="container" id="Concept">
<div class="accordion" id="ConceptA">
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
The Concept
</button></h2>
<div class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
<div class="accordion-body">
<h2>FIRST STEP</h2>
<h3>WHERE THE IDEA COME FROM</h3>
<p> Between 2014 and 2020 Enrica started to collect, through her camera, all the most interesting papers of lost animals she met on her road, in different places around the world.</p>
<p>We put part of this collection in a specific section (click here to see it).</p>
<p>She was particularly impressed by the sentimental value that some of this notice papers could express about the affective tie between the lost animals and their owners.</p>
<p>WORDS</p>
<p>The expressive power of the words used to describe the physical and comportamental aspect of the animal was the most interesting part; indeed, it made us thinking about these particular aspect in a more wide view, including all the potential fields in which it coulded be interesting to study in deep this affective value.</p>
<br>
<p>AN EXEMPLIFICATION</p>
<!--<p><strong>prove con iframe</strong></p>
<iframe src="Nobu.html" width="33%" height="450vh"></iframe>
<iframe src="Gringo.html" width="33%" height="450vh"></iframe>
<iframe src="Luli.html" width="33%" height="450vh"></iframe> -->
<img width="30%" style="margin-left: 35%" src="assets/img/gattocertosino.jpeg">
<div style="width: 50%; margin-left: 25%">
<p>"CERCO GATTO CERTOSINO (Grigio, pelo lucente") SPARITO IERI POMERIGGIO 25/3/22 IN VIA AUDINOT vicino angolo VIA GALLETTI si chiama NOBU ed <b>è un po' timido e tonto</b>"</p>
</div>
<br>
<p>In this particular case we highlighted the words <b>"timido"</b> (shy) and <b>"tonto"</b> (dumb) as a clear exemplification of anthropomorphization, more specifically, the attribution of human's traits, emotions, or intentions to non-human entities.
Many theories have been published about this particular practice in human's history, since it is present (in different shapes) from the beginning of it.
As we said, anthromopomorphization changes its shapes with the history and its tendencies; actually, in the era of technology and social media, animals have been humanized becoming protagounists of social posts and even owners of social media pages, with millions of followers. </p>
<div>SOME EXAMPLES</div>
<img src="assets/img/maya.png" width="30%">
<img src="assets/img/topi.png" width="30%">
<img src="assets/img/marnie.png" width="30%">
<!--<p>At this point we decided to definitelly establish those fields, to start a real project work and search for relevant documentation.
The final choice was to select three different cultural aspects:
<ul>
<li>HISTORY</li>
<li>ART</li>
<li>ACTUALITY</li>
</ul>
But...which was the specific topic about which study in deep?
</p>-->
<p>This tendence encouraged us to search in deep about it, analysing data on social media and reading other staistical researches about the importance of the animal in the era of digitalization and virtual socialiation.</p>
<p> We decided to put these analysis in a specific section of the site, you can go on it by clicking here.</p>
<h2>SECOND STEP</h2>
<h3>CHOICE OF TOPIC</h3>
<p>Since we already decided to base the project on the concept of sentymental bond between a human and its animal, the question at this point was how to translate it in an interesting idea for a cultural initiative.
The challenge was to not result trivial and at the same time to find a theme that coulded be suitable for both an educational and affective final goal.</p>
<img src="assets/img/conc.png" width="60%" style="border-radius: 4vw; margin-left: 20%">
<br>
<h4>FIRST ATTEMPT</h4>
<p>"animals in art"</p>
<p>At first we decided to investigate the presence of the animal in art: how it is considered and which are the most famous works that show animals as protagounists.</b></p>
<p>To help our analysis, we used two useful tools: a preliminary tab with pros and cons, and the design cards.</p>
<table>
<tr>
<th>attractiveness</th>
<th>documentation</th>
<th>reliability</th>
<th>emotionality</th>
</tr>
<tr>
<td>CONS</td>
<td>PROS</td>
<td>PROS</td>
<td>CONS</td>
</tr>
</table>
<p>At the end of our analysis we came to the conclusion that the topic was weak on many aspects: the triviality of the argument could make the initiative less attractive or addressed to a little cathegory; also, the project would have a more didactical finalization.
On the other side, it would not be difficult to retrieve material about the topic, nor to expose it in a physical exhibit; but this idea wouldn't suggest innovationation or stimulation on the audience, and on a more emotional level it wouldn't leave nothing to the visitor.</p>
<br>
<h4>SECOND ATTEMPT (FINAL CHOICE)</h4>
<p>"The animal: stories of how the domestic animal inspired its artist"</p>
<table>
<tr>
<th>attractiveness</th>
<th>documentation</th>
<th>reliability</th>
<th>emotionality</th>
</tr>
<tr>
<td>PROS</td>
<td>CONS</td>
<td>PROS</td>
<td>PROS</td>
</tr>
</table>
<p>This topic seemed more suitable to our necessities. A new interesting thematic, that invoves the emotional sphere of the visitor through the empathization with the author of the work. It is focused more on the emotional aspect than on the artistic, for this reason, the recruitment of the material could be more difficult.</p>
<br>
<h2>THIRD STEP</h2>
<h3>DEFINE THE MUSEOLOGICAL APPROACH</h3>
<img src="assets/img/concep.png" width="60%" style="border-radius: 4vw; margin-left: 20%;">
<p>Once we found the topic, we started to think about it in a museological view; trying to find the best way to translate it into a cultural journey.</p>
<p> Since the theme belongs to an emotional conceptuality, a good idea could be to express it trough a story that accompanies the user trough a journey, articulated in some phases at the end of which the user is free to express his personal story.</p>
<p>The steps that the user encounter during the journey were choosed on the base of the educational and sentymental goal that this project want to reach.</p>
<p><b>CREATING PROCESS: DESIGN CARDS</b></p>
<p>The (.....) designed by (.....) are a tool that we found very interesting and useful to fix our project in a more museological approach; their use helped us to frame all the ideas in a certain standard and to define all the practical aspects of the work that had to be done.
In this phase of ideation we decided to continue to develop both the ideas: that about a virtual initiative located in a real museum, and that about a virtual museum located exclusively online.</p>
<h2>STEP 1: DEFINE CONTEXT</h2>
<p>As first step of our design process we had to choose the most suitable assets (and their hypotetical proper audience)</p>
<div class="two-grid">
<div class="left">
<p>PHYSICAL REFERENCE INSTITUTION</p>
<p>When we decided to deepen the idea related to a physical reference institution the concept was: to develope an interactive app, mobile-interaction based, trough which the visitor could be able to interact with the exhibit using its own mobile-device (a smartphone or a tablet).</p>
<p><img src="assets/img/step1_1.png" width="50%" style="border-radius: 0; margin-left: 25%"></p>
<p><b>[spiegazione]</b></p>
</div>
<div class="right">
<p><b>VIRTUAL MUSEUM</b></p>
<p>In the case of the virtual museum the idea was different, but similar under some aspects: to develope
<p><img src="assets/img/step1.png" width="50%" style="border-radius: 0; margin-left: 25%"></p>
<p><b></b></p>
<p><b>[spiegazione]</b></p>
</div>
</div>
<h2>STEP 2</h2>
<div class="two-grid">
<div class="left">
<p><img src="assets/img/step1_2.png" width="50%" style="border-radius: 0; margin-left: 25%"></p>
</div>
<div class="right">
<p><img src="assets/img/step2.png" width="50%" style="border-radius: 0; margin-left: 25%"></p>
</div>
</div>
<h2>STEP 3</h2>
<div class="two-grid">
<div class="left">
<p><img src="assets/img/step1_3.png" width="60%" style="border-radius: 0; margin-left: 20%"></p>
<p><b>[spiegazione]</b></p>
</div>
<div class="right">
<p><img src="assets/img/step3.png" width="60%" style="border-radius: 0; margin-left: 20%"></p>
<p><b>[spiegazione]</b></p>
</div>
</div>
<h2>PERSONAE </h2>
<div class="two-grid">
<div class="left">
<p><img src="assets/img/Personae1.jpeg" width="60%" style="margin-left: 20%"></p>
<h3>SCENARIO</h3>
<iframe ondblclick="requestFullscreen()" src="SOFIA.html" height="500px" width=100% allow="fullscreen"></iframe>
</div>
<div class="right">
<p><img src="assets/img/personae2.jpeg" width="60%" style="margin-left: 20%"></p>
<h3>SCENARIO</h3>
</div>
</div>
<p> SCENARIO </p>
<h3><b>FINAL DESIGN</b></h3>
<p><b>QUI VA AGGIUNTO UN PICCOLO RIASSUNTO SU: TARGET, SPACE, GOALS, APPROACH</b></p>
<h3>THE EXPERIENCE (CREATING PROCESS)</h3>
<p>After a long creative process, we concluded that the best way to provide a both empathetic and didactic 'visit' was a virtual museum.
The museum is divided in rooms, each of which is dedicated to a different artist and its bond with the animal as entity.
The virtual room is structured in the following way: it is showed as a real museum room (walls, sofa, paints with panels), the paints we choosed to insert inside the space are the most representative of a connection with an animal; each paint has an interactive panel trough which (by clicking it) the user can visualize the work and go into detail.
The information section showed by the panel is divided in some parts; a brief history of the artist, why we choosed him/her for our project and the analysis of most of the emblematic works that can be useful for the user to understand the importance of the animal in the creative processes of the artist.</p>
<h5>(a) <a href="conceptual.html">conceptual map</a></h5>
<p><b>PUT "GENERATE IDEAS AND PREPARE CONCEPTS CARDS".</b></p>
<p>....</p>
<h5>(b) museological approach</h5>
<p>Cathegory E or F of Caraceni taxonomy:</br>
E) Virtual museum that enhance museum objects INTERPRETATION with OPEN INTERACTION in an OPEN SPACE showing SELECTED (or ALL OBJECTS) of the museum collection, ALLOWING visitor CONTRIBUTIONS. </br>
F) Virtual museum making EXPERIMENTS with NEW MUSEOLOGICAL MODELs with OPEN INTERACTION in an OPEN SPACE showing SELECTED (or ALL OBJECTS) of the museum collection, ALLOWING visitor CONTRIBUTIONS. </br>
<table>
<tr><td>NEED</td><td>Interpretaton - Experimentation/complex museum identity</td></tr>
<tr><td>INTERACTION</td><td>Open</td></tr>
<tr><td>SPACE</td><td>Open</td></tr>
<tr><td>CONTENT</td><td>Selected works - Photograph, texts, geo-referenced material</td></tr>
<tr><td>VIRTUAL/REAL</td><td>Virtual with real/Virtual with virtual</td></tr>
<tr><td>VISITORS CONTRIBUTIONS</td><td>Allowed</td></tr>
</table>
<h5>(c) experience design (from the users perspective) (include a diagram)</h5>
<p>....</p>
<h5>(d) the specific CH topic you have selected as case study for your PW</h5>
<p>....</p>
<h5>(e) the chosen cognitive focus (among: 1.Attention-Distraction, 2.Language-Narrative, 3. Meaningfulness-Emotions-Empathy, 4. Authenticity perception, 5. Memory-Recall)</h5>
<p>....</p>
</div>
</div>
</div>
</div>
<div class="container" id="Goals">
<div class="accordion" id="GoalsA">
<div class="accordion-item">
<h2 class="accordion-header" id="headingOne">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Goal (cultural, cognitive, economic, educational etc.)
</button></h2>
<div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
<div class="accordion-body">
<p><b>PUT "DEFINE INSTITUTIONAL GOALS CARDS".</b></p>
</div>
</div>
</div>
</div>
</div>
<div class="container" id="Requirements">
<div class="accordion" id="RequirementsA">
<div class="accordion-item">
<h2 class="accordion-header" id="headingOne">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Requirements
</button></h2>
<div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
<div class="accordion-body">
<p>A requirement is something that your product should do or a quality it should have listed in accordance with its importance:</p>
<ul>
<li>MUST:</li>
<li>SHOULD:</li>
<li>COULD:</li>
<li>WILL NOT:</li>
</ul>
<p>They are defined from data on context, content, and people (and their needs).</p>
</div>
</div>
</div>
</div>
</div>
<!-- ======= Development Section ======= -->
<div class="container" id="Dev">
<div class="accordion" id="accordionExample">
<div class="accordion-item">
<h2 class="accordion-header" id="headingOne">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Development
</button></h2>
<div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
<div class="accordion-body">
<p>...</p>
<h5>(a) The story (include an interactive narrative using Twine)</h5>
<p>Our story tells about a young-adult visitor looking for a new approach art history exhibition. He or she finds the Wanted! website where it is possible to access a short historical preview in the In History section and a selection of pieces of art in the In Art section. She or he is emotionally involved due to their childhood and recent souvenirs about their pets. They enjoy the exibihion, they gain more knowledge and they are happy to contribute at Your stories section with their pets' stories. Moreover they are happy and amused to realize a 3d rendering of their pet to be used in VR or AR and to be able to order for a 3d printed model of it to be gifted.</p>
</br>
<h5 id="ID">(b) Description of the interaction between the project and the users (include Interaction Diagram)</h5>
</br>
<div class="row">
<div class="col-lg-6 col-md-6 d-flex align-items-stretch">
<h5><b>Choose your guide</b></h5></br>
</div>
<div class="col-lg-6 col-md-6 d-flex align-items-stretch">
<h5></h5></br>
</div>
</div>
<div class="row">
<div class="col-lg-12 col-md-12 d-flex align-items-stretch">
<img src="assets/img/interaction/ChooseGuide.JPG" title="Choose your guide interaction schema" align="middle">
</div>
<div class="col-lg-12 col-md-12 d-flex align-items-stretch iframe">
<iframe ondblclick="requestFullscreen()" src="ChooseGuide.html" title="Choose your guide application" width=100%" allow="fullscreen"></iframe>
</div>
</div>
</br>
<div class="row">
<div class="col-lg-6 col-md-6 d-flex align-items-stretch">
<h5><b>Share your Stories</b></h5></br>
</div>
<div class="col-lg-6 col-md-6 d-flex align-items-stretch">
<h5></h5></br>
</div>
</div>
<div class="row iframe">
<div class="col-lg-6 col-md-6 d-flex align-items-stretch">
<img src="assets/img/interaction/Share.jpg" title="Share your Stories interaction schema" width="100%">
</div>
<div class="col-lg-6 col-md-6 d-flex align-items-stretch">
<iframe src="Share.html" title="Share your Stories application" width="100%"></iframe>
</div>
</div>
</br>
<div class="row">
<div class="col-lg-6 col-md-6 d-flex align-items-stretch">
<h5><b>3d print your pet!</b></h5></br>
</div>
<div class="col-lg-6 col-md-6 d-flex align-items-stretch">
<h5><b>Search for your pet!</b></h5></br>
</div>
</div>
<div class="row iframe">
<div class="col-lg-6 col-md-6 d-flex align-items-stretch">
<img src="assets/img/interaction/Share.jpg" title="Share your Stories interaction schema" width="100%">
</div>
<div class="col-lg-6 col-md-6 d-flex align-items-stretch">
<iframe src="Share.html" title="Share your Stories application" width="100%"></iframe>
</div>
</div>
</br>
<h5>(c) Development to reach the cognitive focus</h5>
<p>....</p>
<h5>(c) Foreseen workflow (includes needed software, hardware, professionals)</h5>
<p>....</p>
<h5>(d) Further development and maintenance issues</h5>
<p>....</p>
</div>
</div>
</div>
</div>
<h3>Development</h3>
</div>
<!-- ======= Team Section ======= -->
<section id="team" class="team">
<div class="container" data-aos="fade-up">
<div class="section-title">
<h2>Team roles</h2>
<!--p>Check our Team</p-->
</div>
<div class="row">
<div class="col-lg-6 col-md-6 d-flex align-items-stretch">
<div class="member" data-aos="fade-up" data-aos-delay="100">
<div class="member-img">
<img src="assets/img/team/team-1.jpg" class="img-fluid" alt="">
<div class="social">
<a href=""><i class="bi bi-twitter"></i></a>
<a href=""><i class="bi bi-facebook"></i></a>
<a href=""><i class="bi bi-instagram"></i></a>
<a href=""><i class="bi bi-linkedin"></i></a>
</div>
</div>
<div class="member-info">
<h4>Enrica Zani</h4>
<span>Chief Executive Officer</span>
</div>
</div>
</div>
<div class="col-lg-6 col-md-6 d-flex align-items-stretch">
<div class="member" data-aos="fade-up" data-aos-delay="200">
<div class="member-img">
<img src="assets/img/team/team-2.jpg" class="img-fluid" alt="">
<div class="social">
<a href=""><i class="bi bi-twitter"></i></a>
<a href=""><i class="bi bi-facebook"></i></a>
<a href=""><i class="bi bi-instagram"></i></a>
<a href=""><i class="bi bi-linkedin"></i></a>
</div>
</div>
<div class="member-info">
<h4>Alisia Zarbo</h4>
<span>Product Manager</span>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- ======= Bibliography Section ======= -->
<div class="container" id="Bib">
<h3>Bibliography</h3>
<h4>Project</h4>
<ul>
<li>Caraceni taxonomy</li>
<li>Caraceni Mewseografy</li>
<li>Quelli della classificazione museale</li>
<li>Haraway. <i class=title>The Companion Species Manifesto: Dogs, People, and Significant Otherness</i>, 2003</li>
</ul>
<h4>In History section (vedere se riusciamo a richiamare le bibliografie dei modals)</h4>
<ul>
<li>Arluke, Arnold., and Lauren. Rolfe. <i class=title>The Photographed Cat Picturing Human-Feline Ties 1890-1940</i>. First ed. 2013.</li>
<li><i class=title>Dogs & Cats in Art Wednesday, 22nd January 1997</i>. London: Bonhams, 1996. https://almastart.unibo.it/permalink/f/10694hg/39UBO_SEBINA_DSUBO3965883</li>
</ul>
<h4>In Art section</h4>
<ul>
<li>Barbara Amadasi. "Animal Farm." <i class=title>Vogue (Italia)</i>, no. 716 (2010): 74. https://almastart.unibo.it/permalink/f/pt4j7f/TN_cdi_proquest_miscellaneous_1847846888</li>
<li>Fioroni, Giosetta. <i class=title>Dog</i>. Corraini, 2010.</li>
<li>https://www.albludiprussia.com/giosetta-fioroni-e-linvenzione-della-famiglia/</li>
<li>Boltanski, Christian, Fabio Malossi, Beppe Sebaste, Bologna, and Museo per La Memoria Di Ustica Bologna. <i class=title><a href="https://almastart.unibo.it/permalink/f/10694hg/39UBO_SEBINA_DSUBO2411850" target="_blank">Lista Degli Oggetti Personali Appartenuti Ai Passeggeri Del Volo IH 870</a></i>. S.l: S.n, 2007.</li>
</ul>
<p>...</p>
</div>
<!-- ======= Complementary material Section ======= -->
<div class="container" id="Complementary">
<h3>Complementary Material for the Discussion</h3>
<p>...</p>
<h4>3d object or scene (3D)</h4>
<p><b>CHE DICI SE VEDIAMO SE POSSIAMO FAR FARE UN MODELLINO 3D DEL PER PERDUTO CHE UNO SI REALIZZA E SI PORTA A CASA TIPO STATUINA DEL PRESEPE??</p>
<h4>Trailer (video)</h4>
<p>....</p>
<h4>Audio (i.e. interviews of your potential users)</h4>
<p>....</p>
</div>
</section>
</main><!-- End #main -->
<!-- ======= Footer ======= -->
<footer id="footer">
<div class="footer-top">
<div class="container">
<div class="row">
<div class="col-lg-3 col-md-6">
<div class="footer-info">
<h3>WANTED<span>!</span></h3>
<!--p>
A108 Adam Street <br>
NY 535022, USA<br><br>
<strong>Phone:</strong> +1 5589 55488 55<br>
<strong>Email:</strong> wanted@wanted.com<br>
</p-->
<div class="social-links mt-3">
<a href="#" class="twitter"><i class="bx bxl-twitter"></i></a>
<a href="#" class="facebook"><i class="bx bxl-facebook"></i></a>
<a href="#" class="instagram"><i class="bx bxl-instagram"></i></a>
<a href="#" class="google-plus"><i class="bx bxl-skype"></i></a>
<a href="#" class="linkedin"><i class="bx bxl-linkedin"></i></a>
</div>
</div>
</div>
<!--div class="col-lg-2 col-md-6 footer-links">
<h4>Useful Links</h4>
<ul>
<li><i class="bx bx-chevron-right"></i> <a href="#">Home</a></li>
<li><i class="bx bx-chevron-right"></i> <a href="#">About us</a></li>
<li><i class="bx bx-chevron-right"></i> <a href="#">Services</a></li>
<li><i class="bx bx-chevron-right"></i> <a href="#">Terms of service</a></li>
<li><i class="bx bx-chevron-right"></i> <a href="#">Privacy policy</a></li>
</ul>
</div>
<div class="col-lg-3 col-md-6 footer-links">
<h4>Our Services</h4>
<ul>
<li><i class="bx bx-chevron-right"></i> <a href="#">Web Design</a></li>
<li><i class="bx bx-chevron-right"></i> <a href="#">Web Development</a></li>
<li><i class="bx bx-chevron-right"></i> <a href="#">Product Management</a></li>
<li><i class="bx bx-chevron-right"></i> <a href="#">Marketing</a></li>
<li><i class="bx bx-chevron-right"></i> <a href="#">Graphic Design</a></li>
</ul>
</div>
<div class="col-lg-4 col-md-6 footer-newsletter">
<h4>Our Newsletter</h4>
<p>Tamen quem nulla quae legam multos aute sint culpa legam noster magna</p>
<form action="" method="post">
<input type="email" name="email"><input type="submit" value="Subscribe">
</form>
</div-->
</div>
</div>
</div>
<div class="container">
<div>
<p><strong>Wanted!</strong> is a project developed for the final exam of <emph>Digital Heritage and Multimedia</emph> course within the <a href="https://corsi.unibo.it/2cycle/DigitalHumanitiesKnowledge">DHDK Master's Degree</a>, Alma Mater Studiorum - Università di Bologna, a.y. 2020/2021. Texts and contents organization are released with a <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0 license</a>.</p>
<!--p><strong>Images comes .......</p-->
</div>
<div class="copyright">Website template © Copyright <strong><span>Gp</span></strong>. All Rights Reserved</div>
<div class="credits">
<!-- All the links in the footer should remain intact. -->
<!-- You can delete the links only if you purchased the pro version. -->
<!-- Licensing information: https://bootstrapmade.com/license/ -->
<!-- Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/gp-free-multipurpose-html-bootstrap-template/ -->
Designed by <a href="https://bootstrapmade.com/">BootstrapMade</a>
</div>
</div>
</footer><!-- End Footer -->
<div id="preloader"></div>
<a href="#" class="back-to-top d-flex align-items-center justify-content-center"><i class="bi bi-arrow-up-short"></i></a>
<!-- Vendor JS Files -->
<script src="assets/vendor/purecounter/purecounter.js"></script>
<script src="assets/vendor/aos/aos.js"></script>
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
<script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
<script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
<script src="assets/vendor/php-email-form/validate.js"></script>
<!-- Template Main JS File -->
<script src="assets/js/main.js"></script>
</body>
</html>