forked from ncsu-geoforall-lab/tangible-landscape-talk
-
Notifications
You must be signed in to change notification settings - Fork 0
/
chi2018.html
1246 lines (1152 loc) · 52.4 KB
/
chi2018.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
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
<!doctype html>
<html lang="en">
<!-- This is a generated file. Do not edit. -->
<head>
<meta charset="utf-8">
<title>CHI 2018</title>
<meta name="description" content="Slides for CHI 2018 talk">
<meta name="author" content="NCSU GeoForAll Lab members">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<link rel="stylesheet" href="css/reveal.css">
<link rel="stylesheet" href="css/theme/osgeorel_greyscale.css" id="theme">
<!-- For syntax highlighting -->
<link rel="stylesheet" href="lib/css/zenburn.css">
<!-- For chalkboard plugin -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<!-- If the query includes 'print-pdf', include the PDF print sheet -->
<script>
if( window.location.search.match( /print-pdf/gi ) ) {
var link = document.createElement( 'link' );
link.rel = 'stylesheet';
link.type = 'text/css';
link.href = 'css/print/pdf.css';
document.getElementsByTagName( 'head' )[0].appendChild( link );
}
</script>
<!--[if lt IE 9]>
<script src="lib/js/html5shiv.js"></script>
<![endif]-->
<style>
body {
/*background-color: #FFF !important;*/
/*
background-image: url("pictures/elevation-nagshead.gif");
background-repeat: no-repeat;
background-position: left bottom;*/
}
.reveal section img {
background: transparent;
border: 0;
box-shadow: 0 0 0 rgba(0, 0, 0, 0.15);
}
/* for standalone frame */
/*
iframe {
display: block;
margin-left: auto;
margin-right: auto;
}
*/
/* display: inline; background-color: #002B36; padding: 0px; margin: 0px */
.rounded-corners {
border: 0px solid black;
border-radius: 5px;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
-webkit-border-radius: 5px;
}
a:hover {
color: #444 !important;
text-decoration: underline !important;
}
h1, h2, h3, h4, h5 {
text-transform: none !important;
/* word-break: keep-all; text-transform: none; font-size: 200%; line-height: 110%; */
/* color: #060 !important; */
/* color: #444 !important; */ /* grey from the wab page */
font-weight: bold !important;
-webkit-hyphens: none !important;
-moz-hyphens: none !important;
-ms-hyphens: none !important;
hyphens: none !important;
line-height: 110% !important;
}
.reveal .progress span {
background-color: #444 !important;
}
/* predefined element positioning */
.top {
/*position: relative;*/
top: 5%;
height: 45%; /* is the height even needed? */
}
.bottom {
height: 45%;
}
.ne {
position: absolute;
top: 5%;
right: 5%;
height: 45%;
width: 45%;
}
.nw {
position: absolute;
top: 5%;
left: 5%;
height: 45%;
width: 45%;
}
.se {
position: absolute;
bottom: 5%;
right: 5%;
height: 45%;
width: 45%;
}
.sw {
position: absolute;
bottom: 5%;
left: 5%;
height: 45%;
width: 45%;
}
/* classes for sections with predefined elements */
/* using !important because, reveal styles are applied afterwards */
.right, .textimg > img, .textimg > video, .textimg > iframe, .imgtext > p, .imgtext > ul, .imgtext > ol, .imgtext > div {
float: right;
text-align: left;
max-width: 47% !important;
}
.left, .imgtext > img, .imgtext > video, imgtext > iframe, .textimg > p, .textimg > ul, .textimg > ol, .textimg > div {
float: left;
text-align: left;
max-width: 47% !important;
}
li > ul, li > ol {
font-size: 85% !important;
line-height: 110% !important;
}
.small {
font-size: smaller !important;
color: gray;
margin: 0.1em !important;
}
.credit {
font-size: small !important;
color: gray;
margin: 0.1em !important;
}
</style>
</head>
<body>
<div class="reveal">
<!-- Any section element inside of this container is displayed as a slide -->
<div class="slides">
<!-- Title slide -->
<section>
<h5 style="color: #888">
CHI 2018</h4>
<h4 style="margin-top: 0.25em;color: #000">Tangible Landscape: A Hands-on Method for Teaching Terrain Analysis</h4>
<img height="350px" src="img/Hero_orig.png">
<h6 style="margin-top: 0.5em;color: #888">Garrett C. Millar, Payam Tabrizian, Anna Petrasova, Vaclav Petras, Brendan Harmon, Helena Mitasova, Ross K. Meentemeyer</h6>
<img height="50px" style="margin-top: 2em" src="img/logos/cgaBlack.png">
<img height="50px" style="margin-top: 2em" src="img/logos/ncstate.png">
<aside class="notes">
Good morning everyone, and thank you for coming to my talk. I'll be presenting new ways to teach about landscape form and landscape processes using tangible geospatial user interfaces. <br>
</aside>
</section>
<!-- Outline -->
<!--<section>
<h2>Presentation Outline</h2>
<ul>
<li>Introduction</li>
<li>Tangible Landscape</li>
<li>Pilot Study</li>
<li>Methods</li>
<li>Results</li>
<li>Discussion</li>
<li>Limitations & Future Directions</li>
<li>Conclusion</li>
</ul>
</section> -->
<!-- Introduction -->
<!--<section data-background="img/skyview_30.png" data-state="dimbg">
<h4 style="color: #888">
Introduction</h4>-->
<!--<h3 class="shadow">Introduction</h3>
<ul class="shadow">
<li><b>Spatial Computations:</b></li>
<ul class="shadow">
<li>digital mapping, modeling, analysis, & simulation </li>
<li>help people learn about spatial patterns & processes </li>
</ul>
<li><b>Graphical User Interfaces:</b></li>
<ul class="shadow">
<li>constrain interaction & perception of space </li>
<li>limit spatial learning </li>
</ul>
<li><b>Tangible User Interfaces:</b></li>
<ul class="shadow">
<li>enable embodied interaction with spatial computations</li>
<li>are being rapidly adopted for spatial education</li>
</ul>
<li>Why is this research important?</li>
</ul>
<aside class="notes">
- Spatial patterns & processes: understanding the shape of the earth’s surface or the pattern of water flow.
- GUIS: (paradigmatic mode computer interaction), constrain how users interact, perceive, think about, & learn about
space w/ (as input is limited to pointing devices & keyboards & feedback to graphics).
- Embodied cognition: thinking grounded in bodily presence and experience of 3-dimensional (3D) space
- 3D spatial learning = learning with tangibles
- Why is this research important?
<ul>
<li>TUIs are being rapidly adopted for spatial education </li>
<li>Quick development and adoption Little to NO methods are being developed to assess spatial learning using tangibles </li>
<li>Therefore, it is increasingly important to study how to effectively teach about space & assess spatial learning using tangibles.</li>
</ul>
</aside>
</section>-->
<!-- Background (1)-->
<section>
<h3 style="color: #888">
Embodied Interaction</h3>
<img class="stretch" src="img/system/tl_concept_crop.png">
<ul>
<li>Embodied cognition: a link between perception & action</li>
<!--<li>Tools for solving spatial problems can be cognitively grasped, understood, & simulated into one’s body schema</li>-->
<li>Feeling, action, & thought are functionally integral to cognition</li>
<!--<li>Divide between natural thought processes & the virtual confinement of traditional computer interaction (2D)</li>-->
</ul>
<aside class="notes"> So why use tangible user interfaces to teach landscape form and processes?. Well, lets briefly discuss the theory that motivates the research to follow. <br>
The notion of Embodied Cognition states that human cognition is shaped by
aspects of the entire body. This means feeling,
action, & thought are all functionally integral to cognition. <br>
And Embodied interaction is when people interact both mentally & physically
with technology. So, the way someone interacts with technology can influence
how that system is perceived, processed, & understood.
Now that we know this, lets talk about spatial education, and why exactly
embodied interaction is of interest.
</aside>
</section>
<!-- Intro -->
<section>
<h3 style="color: #888">
Spatial Education</h3>
<img class="stretch" src="img/collaboration_computer.JPG">
<ul>
<li>Spatially-focused curricula = improved student success</li>
<li>Difficult for students to visualize complex landscape processes</li>
<li>Limits students’ success in geoscience classrooms</li>
<li>Why is this?</li>
</ul>
<aside class="notes">
Recently, spatial education curricula have more frequently been incorporating
spatial thinking techniques to improve students’ problem-solving skills. <br>
However, students still have difficulty with visualizing spatial relations
such as object shapes, relative locations, and how these change over time.
<br>
Coming from a cognitive scientist standpoint, we asked why exactly this may
be. <br>
We propose that the difficulty students have when it comes to visualizing
spatial relations is from traditional teaching methods' misuse of 2D materials
(such as computers) to teach about complex 3D spatial concepts. <br>
<!--So, this research offers a physical alternative, designed to better support
students' embodied interaction, visualization of landscape processes, and
spatial learning while learning about Terrain Analysis. -->
</aside>
</section>
<!-- Background (5) -->
<section>
<h3 style="color: #888">
Teaching Methods for Terrain Analysis:</h3>
<div align="center">
<img width="300px" src="img/rural_surveyor_popup.jpg" alt="" align="left" style="float:leftt"/>
<img width="300px" src="img/physical_model2.jpg" alt="" align="right" style="float:right"/>
<div id="content" align="center">
<img width="320px" src="img/contour2.png" alt="" align="center" />
</div>
</div>
<!-- <div align="center">
<img height="150px" src="img/rural_surveyor_popup.jpg" alt="" align="left" style="float:leftt"/>
<img height="150px" src="img/physical_model.jpg" alt="" align="right"/> style="float:right" />
<div id="content" align="center">
<img height="150px" src="img/contour2.png" alt="" align="center" />
</div>-->
<!-- </div>
<!--<img height="150px" src="img/rural_surveyor_popup.jpg">
<img height="150px" src="img/contour2.png">
<img height="150px" src="img/physical_model.jpg">-->
<table width="100%">
<col width="25%">
<col width="50%">
<col width="25%">
<tr>
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;">in-situ surveying
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;">drawing contour maps
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;">building physical models
</tr>
</table>
<aside class="notes">
Before we get into the misuse of 2D teaching materials, here are a few typical methods used to teach Terrain analysis: On-site Surveying, Drawing of Contour Maps, &
Building Physical Models. <br>
However, only some directly teach students how to translate between 2D and 3D space. <br>
</aside>
</section>
<!-- Background (2)-->
<section>
<h3 style="color: #888">
Graphical User Interfaces (GUIs)</h3>
<img height="400px" src="img/arcmap_gui.png">
<ul>
<li>Inflexible in use, and inadequate for users to perceive & process spatial information</li>
<li>Limit ways geospatial data can be represented</li>
<li>Solution?</li>
</ul>
<aside class="notes">
Spatial analyses are also typically carried out with computers, or Grahical
User Interfaces. <br>
However, GUIs limit a users input to mouse & keyboards, and feedback to 2D
graphics <br>
This means GUIs are inadequate for students to visualize & process complex
landscape processes and do NOT allow students to naturally associate spatial
data with 3D space.<br>
</aside>
</section>
<!-- Tangible user interfaces (TUIs)-->
<section>
<h3 style="color: #888">
Tangible User Interfaces (TUIs)</h3>
<ul>
<li>Offer more natural & intuitive mode of interaction</li>
<li>Allow users to cognitively grasp & physically manipulate 3D
data</li>
<li>Connect intention, thought, action, & feedback</li>
<li>Help students better explore, model, visualize, & think about
complex landscape processes</li>
</ul>
<div align="center">
<img width="350px" src="img/interaction/tl_hand_1.png" alt="" align="left" style="float:leftt"/>
<img width="350px" src="img/interaction/tl_hand_3.png" alt="" align="right" style="float:right"/>
<div id="content" align="center">
<img width="350px" src="img/interaction/tl_hand_2.png" alt="" align="center" />
<!-- <img width="300px" src="img/interaction/tl_hand_1.png" alt="" align="left" style="float:leftt"/>
<img width="300px" src="img/interaction/tl_hand_3.png" alt="" align="right" style="float:right"/>
<div id="content" align="center">
<img width="300px" src="img/interaction/tl_hand_2.png" alt="" align="center" />-->
</div>
</div>
<!-- <img height="300px" src="img/interaction/TUI_GUI.png"> -->
<!-- <p><small>GRASS Tangible User Interface (TUI) & Graphical User Interface (GUI)</a>
</small></p>-->
<aside class="notes">
One solution may be Tangible User Interfaces, as they have been shown to
enhance spatial ability by affording embodied interaction & improving
perception through visual and haptic feedback. <br>
TUIs are systems which allow users to interact with digital information
through user-performed physical (i.e., hands-on) input. <br>
This more natural mode of interaction can allow students to associate 2D
field, map, and GIS data simultaneously with
complex, 3D landscape structures <br>
Therefore, it is proposed that TUIs should help students better explore,
model, visualize, and learn about complex landscape processes.
</aside>
</section>
<!-- TL -->
<!-- Tangible Landscape -->
<section data-background-image="img/interaction/tl_interaction.gif" data-background-size="100%" data-state="dimbg" >
<h1 class="shadow">Tangible Landscape:</h1>
<h3 class="shadow">A tangible user interface powered by open source GIS</h3>
<!--<img class="500px" src="img/interaction/tl_interaction.gif">-->
<img height="150px" src="img/logos/logo_black.png">
<!--<p><small>Source: <i class="fa fa-creative-commons" aria-hidden="true"></i> <a href="https://tangible-landscape.github.io">NCSU GeoForAll Lab</a></small></p>-->
<aside class="notes">
One example of Tangible User Interfaces is Tangible Landscape, a system developed by my colleagues at the Center for Geospatial Analytics, at NC State University.
</aside>
</section>
<!-- TL: Design & Concept -->
<section>
<h3 style="color: #888">
Tangible Landscape: Design & Concept </h3>
<img height="350px" src="img/system/system_schema.png">
<!--<video data-autoplay src="video/tl_flow.mp4" width="560" height="315" loop="loop">-->
<video data-autoplay width="560" height="315" controls muted loop>
<source src="video/tl_flow.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<p>With Tangible Landscape you can hold a GIS in your hands - feeling the shape of the earth, sculpting its topography, and directing the flow of water.</p>
<aside class="notes">
Tangible Landscape uses a physical representation of a landscape which
students can make changes to. <br>
As students change the physical model, the changes are 3D scanned by the Kinect
sensor, georeferenced, and imported
into GRASS GIS. <br>
GRASS uses this information to compute and update any kind of geospatial
analysis, model, and simulation. <br>
The results of these analyses are then projected back onto the physical model
as feedback so students can see how their physical changes affect a
landscape's form and its simulated processes, ALL in REAL-TIME. <br>
BECAUSE OF THIS: TL provides a much broader range of teaching opportunities
than other technologies. <br>
</aside>
</section>
<!-- <iframe data-autoplay <iframe width="560" height="315" src="https://www.youtube.com/embed/Cd3cCQTGer4?rel=0&showinfo=0;loop=1&playlist=Cd3cCQTGer4" frameborder="0" allowfullscreen></iframe>-->
<!-- TL: Design -->
<!--<section>
<h4 style="color: #888">
Tangible Landscape</h4>
<h3>Design</h3>
<p>The Tangible Landscape system integrates four main computational components:</p>
<ol>
<li>3D scanning (of physical model)</li>
<li>point cloud processing</li>
<li>geospatial computation</li>
<li>projection</li>
</ol>
<aside class="notes">
Specifically, as users change the physical model, the model is 3D scanned as a point cloud, georeferenced, imported into
GRASS GIS, and either binned or interpolated as a digital elevation model. <br>
The digital elevation model is used to compute geospatial analyses, models, and simulations, which are then
projected back onto the physical model, ALL in REAL-TIME.
</aside>
</section>-->
<!-- TL: Design (2) -->
<!--<section>
<h4 style="color: #888">
Tangible Landscape</h4>
<h3>Design</h3>
<p>These components combine to create a continuous cycle of 3D scanning, geospatial modeling, and projection.</p>
<img class="stretch" src="img/system/system_schema.png">
</section> -->
<!-- Scanning
<section>
<h4 style="color: #888">
Tangible Landscape</h4>
<h3>3D Scanning</h3>
<img class="stretch" src="img/interaction/fusion.jpg">
<p>with Kinect sensor</p>
</section> -->
<!-- TL as a Teaching Tool -->
<!-- <section>
<h4 style="color: #888">
Tangible Landscape as a Teaching Tool</h4>
<p>By combining computerbased design and embodiment, Tangible Landscape has the potential to transform existing
teaching methods within the hard sciences, social sciences, and mathematics.</p>
<aside class="notes"> Hard Sciences: biology chemistry, physics, geography<br>
Social Sciences: sociology, human geology<br>
^^This is in specific consideration of the multiple ways students can interact and therefore learn with TL... (GO TO NEXT SLIDE)
</aside>
<img height="300px" src="img/class.JPG">
<img height="300px" src="img/collaboration2.JPG">
</section> -->
<!-- Interactions -->
<section>
<h3 style="color: #888">
Interactions</h3>
<p>Students can physically interact with digital models and simulations by:</p>
<img class="stretch" src="img/interaction/TL_Interaction.png">
<table width="100%">
<col width="16.50%">
<col width="16.50%">
<col width="16.50%">
<col width="16.50%">
<col width="16.50%">
<col width="16.50%">
<tr>
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;">sculpting surfaces (hands)
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;">carving surfaces (knife)
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;">placing waypoints (markers)
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;">drawing walking routes (laser)
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;">establishing viewpoints (marker)
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;">planting vegetation (felt)
</tr>
</table>
<aside class="notes">
Tangible Landscape is also unique in that it allows students to interact with a
landscape in many different ways such as building physical models with their hands or a wooden knife or even placing wooden markers as waypoints to design hiking routes. <br>
These various modes of interaction enable students to immediately see how they
are changing terrain properties like contours, hillslope steepness, or water
flow.
</aside>
</section>
<!-- Tangible Lessons -->
<section>
<h3 style="color: #888">
Tangible Lessons</h3>
<ol>
<li>Water flow: flowpath, channeling, & ponding </li>
<li>Landforms: required participants to build & identify landforms </li>
<li>Cut & fill: participants changes landscapes based on provided contours </li>
</ol>
<aside class="notes">
Using Tangible Landscape, we developed 3 tangible teaching lessons to teach
the concepts of hydrology (water flow), geomorphology (referenced to as Landforms), and grading (or, Earthwork / Cut & fill).
</aside>
</section>
<!-- Tangible Lessons: Water Flow -->
<section>
<h3 style="color: #888">
Water Flow</h3>
<video data-autoplay class="stretch" controls muted loop>
<source src="video/Drain.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<p>Flowpath<br>
<small>(r.drain)</small></p>
<aside class="notes">
The first lesson is Water Flow, or Hydrology. It is split into 3 parts... or
"sub-tasks" <br>
The first sub-task is FLOWPATH, where students have to find the highest source
point from which water will flow into the target point in the landscape.<br>
</aside>
</section>
<!-- Tangible Lessons: Water Flow -->
<section>
<h3 style="color: #888">
Water Flow</h3>
<video data-autoplay class="stretch" controls muted loop>
<source src="video/Channeling.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<p>Channeling<br>
<small>(r.sim.water)</small></p>
<aside class="notes">
Second is CHANNELING, where students must modify the terrain surface to make
water flow from the given source point to the given target point. <br>
</aside>
</section>
<!-- Tangible Lessons: Water Flow -->
<section>
<h3 style="color: #888">
Water Flow</h3>
<video data-autoplay class="stretch" controls muted loop>
<source src="video/Ponding.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<p>Ponding<br>
<small>(r.fill.dir)</small></p>
<aside class="notes">
And the last is PONDING, which requires students to build a damn on a stream
to impound the maximum volume of water.
</aside>
</section>
<!-- Tangible Lessons: Landforms -->
<section>
<h3 style="color: #888">
Landforms</h3>
<video data-autoplay class="stretch" controls muted loop>
<source src="video/Landforms.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<p><small>(r.geomorphon)</small></p>
<aside class="notes">
The second Tangible Lesson is Landforms, which also contains 3 sub-tasks...
simple, compound, & complex landforms. <br>
Each sub-task requires students to create and identify given landforms,
completed in 3 rounds of increasing difficulty, from simple, to compound, to
complex landforms. <br>
<br>
SIMPLE: 1 depression (round 1); 1 ridge (round 2); & 1 valley (round 3)<br>
COMPUND: 2 ridges & 1 valley (round 1); 1 peak, 1 valley, & 1 depression (round 2); 2 valleys & 1 depression (round 3)<br>
COMPLEX: 3 ridges & 3 valleys (round 1); 3 peaks, 2 depression, & 2 ridges (round 2); 1 footslope & 1 spur (round 3)<br>
</aside>
</section>
<!-- Methods: Tangible Lessons: Cut & Fill -->
<section>
<h3 style="color: #888">
Cut & Fill</h3>
<video data-autoplay class="stretch" controls muted loop>
<source src="video/Cut_Fill1.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<p>Basic</p>
<aside class="notes"> The third is Cut & Fill, or Grading, where students must try to change landscapes to match a desired elevation based on provided feedback. <br>
This is made up of two parts, BASIC & ADVANCED. <br>
With BASIC, students are provided with blue & red colors, with blue signifying where sand should be added, and red to signify where sand should be cut.
</aside>
</section>
<!-- Methods: Tangible Lessons: Cut & Fill -->
<section>
<h3 style="color: #888">
Cut & Fill</h3>
<video data-autoplay class="stretch" controls muted loop>
<source src="video/Cut_Fill2.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<p>Advanced</p>
<aside class="notes">
And in ADVANCED, students must match the desired elevation using only contour lines & grapical feedback (bar graph).
</aside>
</section>
<!-- Pilot Study -->
<section data-background-image="img/Hero_ppl.png" data-background-size="100%" data-state="dimbg" >
<h1 class="shadow">Pilot Study:</h1>
<h2 class="shadow">Teaching Landscape Form & Processes</h2>
<aside class="notes"> Now, lets go through the actual research we conducted with Tangible Landscape.
</aside>
</section>
<!-- Research objectives -->
<section>
<h3 style="color: #888">
Research Objectives</h3>
<ul>
<li>Test the effectiveness of a hands-on method for teaching spatial concepts
using Tangible Landscape by:</li>
<ul>
<li>testing students’ acquisition & transfer of knowledge </li>
<li>examining students’ ratings of the system’s usability & user
experience</li>
</ul>
</ul>
<img class="100%" src="img/session_format.jpg">
<aside class="notes"> In efforts to test the effectiveness of using a TUI to teach spatial concepts (specifically Terrain Analysis), <br>
these lessons (that were just shown) were used in a pilot study, where graduate Landscape
Architecture students were tested before & after each tangible lesson in order
to examine any increases in spatial learning. <br>
Ratings of Tangible Landscape's usability were also collected.
</aside>
</section>
<!-- Methods: Environment -->
<!--<section>
<h4 style="color: #888">
Study Environment</h4>
<p>Conference room & adjacent workshop room</p>
<img class="100%" src="img/session_format.jpg">
<aside class="notes">
</aside>
</section> -->
<!-- Methods: Apparatus -->
<!--<section>
<h4 style="color: #888">
Apparatus</h4> -->
<!-- <img class="100%" src="img/TL_Setup.png"> -->
<!--<ul>
<li><p>Three Tangible Landscape systems </p></li>
<ul>
<li>Computer: operated on Linux with GRASS GIS</li>
<li>Physical models: made of malleable deformable polymer enriched sand</li>
<li>3D sensor: Kinect sensor connected to GRASS GIS</li>
</ul>
</ul>
<aside class="notes">
Computer: System 76 Oryx Laptop, operated on Linux with GRASS GIS<br>
–GRASS: open source software for geospatial modeling and analysis–with Tangible Landscape plugin<br>
Models: 35x35cm in size, precisely casted with digitally fabricated molds based on local regions (e.g., Asheville, North Carolina, USA).<br>
Kinect sensor: an efficient & inexpensive 3D scanner connected to GRASS GIS
</aside>
</section> -->
<!-- Methods: Procedure -->
<section>
<h3 style="color: #888">
Procedure</h3>
<ul>
<li>Three, one-week sessions </li>
<ul>
<li>Contained tangible lessons for teaching fundamentals of grading,
geomorphology, & hydrology </li>
<li>Session format:
<ol>
<li>paper-based pretest</li>
<li>introduction explaining the lesson content</li>
<li>tangible lessons</li>
<li>paper-based posttest</li>
</ol>
</ul>
</ul>
<aside class="notes"> So, the pilot study was carried out over three, 1-week sessions, each containing their own tangible lesson.
The sessions all followed the same format in that they began with testing the
students' knowledge of the to-be-taught concept, the lesson content was
introduced, students then completed the tangible lesson using Tangible
Landscape, and were finally tested again with a posttest to measure any
potential increases in spatial learning.
</aside>
</section>
<!-- Methods: Participants -->
<section>
<h3 style="color: #888">
Participants</h3>
<ul>
<li>16 graduate students from a Landform, Grading, & Site Systems course</li>
<li>Age ranges:</li>
<ul>
<li>18-24 (N = 10)</li>
<li>25-34 (N = 5)</li>
<li>35-44 (N = 1)</li>
</ul>
<li>Voluntary participation during class time </li>
<li>Divided into pairs based on preference </li>
</ul>
</ul>
<aside class="notes"> The participants were 16 graduate students from a Landform,
Grading, & Site Systems course, who worked in pairs for the entire 3-week study. <br>
</aside>
</section>
<!-- Methods: Tangible Lessons -->
<section>
<p>Interaction, feedback, & example solutions </p>
<img class="stretch" src="img/Taskprogress_19.jpg">
<aside class="notes"> This graphic shows the type of interaction for each lesson, the feedback given to students, and the final solution for them to learn the correct answer (whether or not the task was completed correctly). <br>
Looking at the first column on the left (showing the Drain Task from the Water Flow lesson), you can see the student placing the marker to denote the highest point from which water will flow into the target point, <br>
the feedback presented to represent where the water would flow<br>
and the solution showing the correct placement of the marker.
</aside>
</section>
<!-- Methods: Materials & Scoring -->
<section>
<h3 style="color: #888">
Materials & Scoring</h3>
<ul>
<li>Topographic Map Assessment (TMA)</li>
<li>Tangible Lesson Assessments</li>
<li>User Experience Survey</li>
</ul>
<aside class="notes"> So to assess 3D spatial learning using TUIs, we used the following evaluation methods: the Topographic Map Assessment, 2 Tangible Lesson Assessments, and a User Experience Survey. And I will describe each in detail....
</aside>
</section>
<!-- Methods: Materials & Scoring -->
<section>
<h3 style="color: #888">
Topographic Map Assessment (TMA) <br><br>
<small>(Newcombe et al., 2015)</small></h3>
<img class="stretch" src="img/TMA_TL_TMA.png">
<table width="100%">
<col width="25%">
<col width="50%">
<col width="25%">
<tr>
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;"><b>Pretest</b>
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;"><b>Tangible Lesson</b>
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;"><b>Posttest</b>
</tr>
</table>
<br>
<p>Assessed students’ acquisition & transfer of spatial skills</p>
<aside class="notes">
So, to measure students' overall acquisition & transfer of spatial skills, we
administered the Topographical Map Assessment (developed by Newcombe &
colleagues) in the 1st session & 2 weeks after the last session<br>
Overall, the TMA contains 3 types of topographic map test items: <br>
(1) elevation items–require an understanding of how elevation is represented through contour lines; <br>
(2) shape items–comprehension of 3D shapes within the represented terrain; <br>
(3) shape and elevation items–contain both the aforementioned constructs.<br><br>
Spatial Skills: understanding how elevation is encoded on topographic maps & how 3D terrain shape is represented on maps)
</aside>
</section>
<!-- Methods: Materials & Scoring -->
<section>
<h4 style="color: #888">
Tangible Lesson Assessments</h4>
<h3>
Landforms Assessment</h3>
<img class="stretch" src="img/test_landform_test.png">
<table width="100%">
<col width="25%">
<col width="50%">
<col width="25%">
<tr>
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;"><b>Pretest</b>
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;"><b>Tangible Lesson</b>
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;"><b>Posttest</b>
</tr>
</table>
<br>
<p>Measured student’s knowledge specific to content in the <b>landforms</b> tangible lesson </p>
<aside class="notes">
Two Tangible Lesson Assessments were also administered, before & after each
tangible lesson. <br>
These were developed by us, and more specifically measured
what students learned during each lesson. <br>
Landforms assessment: had to identify & write the landform type (out of 5
types total) inside the boundary of a contour map of a mountainous area<br>
</aside>
</section>
<!-- Methods: Materials & Scoring -->
<section>
<h4 style="color: #888">
Tangible Lesson Assessments</h4>
<h3>
Cut & Fill Assessment</h3>
<img class="stretch" src="img/test_cutfill_test.png">
<table width="100%">
<col width="25%">
<col width="50%">
<col width="25%">
<tr>
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;"><b>Pretest</b>
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;"><b>Tangible Lesson</b>
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;"><b>Posttest</b>
</tr>
</table>
<br>
<p>Measured student’s knowledge specific to content in the <b>cut & fill</b> tangible lesson </p>
<aside class="notes">
Cut & fill assessment: had to highlight areas in the contour map that had
undergone cut & fill operationsand use 3D views & profiles to complete the
contour lines inside a demarcated blank region on the contour map. <br><br>
</aside>
</section>
<!-- Methods: Materials & Scoring -->
<section>
<h3 style="color: #888">
User Experience Survey <br><br>
<small>(Ras et al., 2012)</small></h3>
<ul>
<li>Examined how students perceived and interacted with Tangible Landscape, & how they collaborated to solve a problem </li>
<li>Constructs:</li>
<ul>
<li>Performance expectancy </li>
<li>Pragmatic quality:</li>
<ul>
<li>physical objects (wooden carving tools, physical landscape model) </li>
<li>visual objects (projection, digital feedback)</li>
</ul>
<li> Effort expectancy </li>
<li>User experience</li>
</ul>
</ul>
<aside class="notes">
Lastly, to examine how useful students found Tangible Landscape to be for
completing Terrain Analysis tasks, a User Experience Survey was given at the
end of the study. <br>
The main constructs assessed with the survey were: <br>
(1) <b>Performance Expectancy:</b> which refers to the degree a user thinks using a system will help them perform well on a task; <br>
(2) <b>Pragmatic Quality:</b> Practicality of a system's use, in this case we refer to the physical objects (wooden carving tools, physical landscape model) and visual objects (projection, digital feedback) used during interaction.
(3) <b>Effort Expectancy:</b> known as a system’s perceived ease of use
(4) <b>User Experience:</b> focuses on overall satisfaction, comfort, and perceptions of the system’s effectiveness
<br>
</aside>
</section>
<!-- Results: Knowledge Building -->
<section>
<h4 style="color: #888">
Results</h4>
<h3>Knowledge Building: Tangible Lessons</h3>
<img height="350px" src="img/Landforms_CutFill_Scatterplot2.png">
<img height="350px" src="img/Cutfill_Landforms_barplot_errorbars.png">
<table width="100%">
<col width="50%">
<col width="50%">
<tr>
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;">Individual Scores
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;">Mean Scores
</tr>
</table>
<aside class="notes">
Here we see the results from comparing students' pre- and post-test scores on
the Landforms & Cut-Fill Lesson Assessments. <br>
On the left, is the distribution of participants' individual scores (out of
100%), and on the right is the overall mean scores. <br>
After running paired t-tests for each lesson analysis, no significant
differences for the Landforms Assessment were shown, <br>
HOWEVER, the analysis did
reveal significant differences for the Cut & Fill Assessment, which means
participants scored significantly higher on the Cut & Fill assessment after
completing the Cut & Fill tangible lesson.
<br><br>
Cut & Fill: (t(2.73), p = .016). <br>
Pre (M = 53.25, SD = 19.27)) <br>
Post (M = 59.97, SD = 16.14))
</aside>
</section>
<!-- Results: Knowledge Building (2) -->
<section>
<h4 style="color: #888">
Results</h4>
<h3>Knowledge Building: TMA</h3>
<img height="350px" src="img/TMA_scatterplot.png">
<img height="350px" src="img/TMA_barplot_errorbars.png">
<table width="100%">
<col width="50%">
<col width="50%">
<tr>
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;">Individual Scores
<td style="vertical-align: middle; text-align:center; border-bottom: 0px; padding: 0;">Mean Scores
</tr>
</table>
<aside class="notes">
For the Topographical Map Assessment, analyses revealed no significant
differences in scored between Pre & Post. <br><br>
(t(-0.66), p = .521). <br><br>
Analyses split by TMA question type showed no significant differences
in response accuracy across multiple levels of geographic understanding.
</aside>
</section>
<!-- Results: User Experience -->
<section>
<h4 style="color: #888">
Results</h4>
<h3>User Experience</h3>
<ul>
<li>All items rated above the neutral value of 4 (out of 7) </li>
<li>Most advantageous aspects of Tangible Landscape?</li>
<ul>
<li>ability to explore various solutions for the given problems (e.g., water flow, landforms, cut and fill) </li>
<li>physical objects allowed students to change parameters (e.g., location of solution points) very quickly</li>
<li>projected visual feedback helped them better understand the effects of changing those parameters</li>
</ul>
</ul>
<aside class="notes">
For the User Experience Survey, it was shown that students rated all of the items above the neutral value of 4 (out of 7); meaning students rated the entire system positively. <br>
Looking at the highest rated items from the survey, we identified Tangible Landscape's most advantageous aspects, which were:<br>
<b>READ SLIDE</b>
</aside>
</section>
<!-- Conclusion-->
<section>
<h3 style="color: #888">
Conclusion</h3>
<ul>
<li>Preliminary evidence for Tangible Landscape supporting improved user experience and marginal, task-specific
knowledge building</li>
<li>Knowledge building:</li>
<ul>
<li>Ability to directly feel, grasp, and manipulate the various tangible materials </li>
</ul>
<li>User Experience:</li>
<ul>
<li>Students can try, see and feel, and directly experience multiple variations of a given solution </li>
</ul>
</ul>
<aside class="notes">
Our findings showed that participants performed significantly
better on the Cut & Fill (earth moving) assessment after having completed the analogous task with Tangible Landscape. <br>
This can be explained by the ability to directly feel, grasp,
and manipulate the various tangible materials as well as the projected visual feedback which helped them better understand the effects of their changes. <br>
Also, results from the User Experience Survey highlight how Tangible Landscape allows users to try, see & feel, and directly experience multiple variations
of a given solution. <br>
Specifically, action is reversible with Tangible Landscape, and this encourages users to explore without risk of consequence. <br><br>
</aside>
</section>
<!-- Limitations & Future Directions-->