-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathuser_manual_ing.html
1040 lines (1030 loc) · 62.4 KB
/
user_manual_ing.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">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/estilos_menu.css">
<!-- ESTILOS DE USER MANUAL PARA NO CREAR CONFLICTOS DESPUES DE 3 AÑOS -->
<link rel="stylesheet" href="css/estilos_usermanual.css">
<link rel="icon" href="images/favicon_sylard3.svg" sizes="any" type="image/svg+xml">
<link
href="https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="fonts/style.css">
<link rel="stylesheet" href="css/bootstrap-grid.css"> <!--GRID SOLAMENTE-->
<title>User Manual</title>
</head>
<body>
<header>
<div class="container-fluid back_aqua">
<!--INICIA barra de navegacion superior-->
<nav class="container contenedor_ancho_area_principal">
<div class="contenedor_switch float_left">
<label class="texto" for="checkbox">ESP</label>
<label class="switch">
<input type="checkbox">
<span class="slider round"></span></label>
<label class="texto" for="checkbox">ENG</label>
</div>
<div class="barra_superior_elemento float_left "><a href="#"><span class="icono icon-home1"></span>
SYLARD</a></div>
<!-- la clase "ACTIVE" se usa en la sección que esta activa-->
<!-- En el caso de HOME este elemento desaparece, ya que hay un icono en la barra publico-->
<!-- <div class="barra_superior_elemento float_right"><a class="" href="login.html">ACCESAR <span class="icono icon-login"></span></a></div>
<div class="barra_superior_elemento float_right"><a href="registro.html" class="active_a">REGISTRO <span class="icono icon-person"></span></a></div>-->
<div class="barra_superior_elemento dropdown_menu_usuario float_right">
<button class="dropbtn_barra_superior">
<div class="contenedor_icono_usuario"><img src="images/iconousuario.svg"
class="imagen_icono_usuario" alt="Ícono de venado usuario"></div>
Emiliano Zapata <span class="icono icon-angle-down" id="flecha_dropdow_barra_superior"></span>
</button>
<div class="contenido_dropdown_menu_usuario">
<a href="#"><span class="icono_dropdown_menu_usuario_item icon-edit"></span> Editar cuenta</a>
<a href="#"><span class="icono_dropdown_menu_usuario_item icon-key1"></span> Editar
contraseña</a>
<a href="#"><span class="icono_dropdown_menu_usuario_item icon-folder-open-o"></span> Mis
colecciones</a>
<a href="#">Link 1 </a>
<a href="#">Link 2</a>
<a class="dropdown_menu_usuario_logout" href="#"><span
class="icono_dropdown_menu_usuario_item icon-log-out"></span> Cerrar sesión</a>
</div>
</div>
</nav>
<!--TERMINA barra de navegacion superior-->
</div>
<div class="container-fluid back_aqua_0">
<nav class=" container contenedor_barra_nav_publico">
<a class="barra_nav_publico_elemento" href="#" id="bnpe_1"><span
class="icono_nav_publico icon-home1"></span></a>
<a class="barra_nav_publico_elemento" href="#" id="bnpe_2">Catálogo</a>
<a class="barra_nav_publico_elemento" href="#" id="bnpe_3">Documentación</a>
<a class="barra_nav_publico_elemento" href="#" id="bnpe_4">Manual de usuario</a>
<h1 class="logo_menu" id="bnpe_5">SYLARD</h1>
<a class="barra_nav_publico_elemento" href="#" id="bnpe_6">Contacto</a>
<a class="barra_nav_publico_elemento" href="#" id="bnpe_7">Código fuente</a>
<a class="barra_nav_publico_elemento" href="#" id="bnpe_8">Términos y condiciones</a>
<a class="barra_nav_publico_elemento" href="#" id="bnpe_9">Creditos</a>
</nav>
</div>
</header>
<main>
<div class="container-fluid" id="contenedor_acerca_de">
<div class="extension_fondo_blanco_izquierdo d-sm-none d-md-block"></div>
<div class="container">
<div class="row contenedor-90vh" id="fila1_acerca_de">
<div class="col-md-7" id="columna_izquierda_acerca_de">
<div class="columna_izquierda_seccion_standar">
<h1 class="color_principal h1_para_fijas">Manual for SYLARD</h1>
<h3 class="h3_para_fijas">Table of contents</h3>
<ol>
<li><a href="#introduction">Introduction</a></li>
<li><a href="#stage1">Stage 1 | <strong>Beginning</strong></a></li>
<li><a href="#stage2">Stage 2 | <strong>Accessing SYLARD</strong></a></li>
<li><a href="#stage3">Stage 3 | <strong>Registration</strong></a></li>
<li><a href="#stage4">Stage 4 | <strong>Log-in and reset password options</strong></a>
</li>
<li><a href="#stage5">Stage 5 | <strong>Creating a collection</strong> </a></li>
<li><a href="#stage6">Stage 6 | <strong>Uploading annotated audio to a
collection</strong></a>
</li>
<li><a href="#stage7">Stage 7 | <astrong>Setup viewer</astrong></strong> </a></li>
<li><a href="#summary">Summary</a></li>
</ol>
<h2 class="h2_para_fijas">Introduction</h2>
<p class="parrafo_grande"><strong>SYLARD</strong> (Synchronized Language Annotation Result
Display) is a
program designed to allow line-by-line playback of digital audio that has been annotated
in the ELAN (EUDICO Linguistic Annotator; <a
href="https://archive.mpi.nl/tla/elan">https://archive.mpi.nl/tla/elan</a>)
time-coded
format. It does this by converting the ELAN XML code to online HTLM and linking this
HTML file to an .mp3 version of the original uncompressed .wav audio file. The .wav file
is the format used for permanent archiving whereas the .mp3 is used for online playback
through a browser. Note that use of SYLARD requires registration, which is requested to
assure that all those who access SYLARD have agreed to the terms and conditions of fair
use established by a Creative Commons license (<a
href="https://creativecommons.org/">https://creativecommons.org/</a>).</p>
<p class="parrafo_grande">SYLARD allows for two types of registration:</p>
<ol>
<li><strong>Visitors:</strong> Can freely access and play back all materials (.mp3 audio
and annotations [including transcriptions and translations]). Registration as a
Visitor is automatic and quick and is simply used to assure that Visitors have
agreed to the Terms and Conditions.</li>
<li><strong>Contributors:</strong> Can create a collection that they control and
administer. A Contributor must have independently uploaded an .mp3 version of the
annotated audio to a secure (https) server. SYLARD allows the Contributor to create
the collection metadata and to upload ELAN files for conversion to HTML while
linking the annotations to the .mp3 file for line-by-line playback.</li>
</ol>
<p class="parrafo_grande">The following details are for Contributors. Visitors can register
simply by sliding the selection in the top left corner to Visitor instead of Contributor
(see <a href="#figure4">fig. 4</a>)</p>
<h3 class="h3_para_fijas" id="stage1">Stage 1: <strong>Beginning</strong></h3>
<p class="parrafo_grande">Go to the Mesolex home page (<a href="#figure1">Fig. 1</a>;
presently at
<a
href="https://mesolex-drako-iano9.ondigitalocean.app/en">https://mesolex-drako-iano9.ondigitalocean.app/en</a>)
and then click on Topic Index to
access five different paths to Mesolex data (<a href="#figure2">Fig. 2</a>: Lexicons,
Library, Flora and Fauna,
Audios, Videos). SYLARD is accessed by clicking on the Audios square.
</p>
<figure id="figure1">
<a href="images/01_Mesolex-portal-home-page.jpg"><img class="imagen_para_estaticas"
src="images/01_Mesolex-portal-home-page.jpg" alt="Figure 1"></a>
<figcaption><strong>Figure 1:</strong> Mesolex home page: Path to SYLARD.
</figcaption>
</figure>
<figure id="figure2">
<a href="images/02_Mesolex_Topic-index.jpg"><img class="imagen_para_estaticas"
src="images/02_Mesolex_Topic-index.jpg" alt="Figure 2"></a>
<figcaption><strong>Figure 2:</strong> Mesolex Topic Index home page (Path to SYLARD via
Audios).</figcaption>
</figure>
<h3 class="h3_para_fijas" id="stage2">Stage 2: <strong>Accessing SYLARD</strong></h3>
<p class="parrafo_grande">After clicking on Audios in the Mesolex
Topic Index screen (<a href="#figure2">fig. 2</a>), the user is taken to the SYLARD home
page (<a href="#figure3">fig. 3</a>). On this
page there is a dark blue-green header band that brings users to any one of several
functionalities and documents: Catalogue, About SYLARD, User manual (this document),
Source code (on GitHub), Terms and Conditions, and Credits. For those who have already
registered (as either Visitor or Contributor) there is a Login option (upper right). For
those new to SYLARD there is a Sign-up (upper right) or Registration option (the latter
is one of three clickable options in mid-page). Clicking either Sign-up or Register
takes the new user to the Registration page (see figs. <a href="#figure4">4</a>, <a
href="#figure5">5</a>, <a href="#figure6">6</a>).</p>
<figure id="figure3">
<a href="images/03_SYLARD-home-page.jpg"><img class="imagen_para_estaticas"
src="images/03_SYLARD-home-page.jpg" alt="Figure 3"></a>
<figcaption><strong>Figure 3: </strong>SYLARD home page.</figcaption>
</figure>
<h3 class="h3_para_fijas" id="stage3">Stage 3: <strong>Registration</strong></h3>
<p class="parrafo_grande">Registration is accomplished through the
Registration panel. The lefthand rectangle with blue background contains a link to the
Terms and Conditions that Visitors and Contributors agree to by completing their
registration.</p>
<p class="parrafo_grande">
At the top left of the righthand section (white background) users are asked to choose
the status for which they wish to register (Visitor or Contributor). The first steps are
virtually the same for both but the Contributor status differs in that this status must
(1) be authorized by the SYLARD administrator (figs. <a href="#figure10">10</a>, <a
href="#figure11">11</a>, and <a href="#figure12">12</a>) and (2) allows the
user to create collections and populate them with annotated audio accessible through any
browser. As the Visitor status is limited to viewing only, administrative authorization
is not necessary.
</p>
<figure id="figure4">
<a href="images/04_SYLARD-registration-contributor.jpg"><img
class="imagen_para_estaticas"
src="images/04_SYLARD-registration-contributor.jpg" alt="Figure 4"></a>
<figcaption><strong>Figure 4:</strong> Register as either Visitor or
Contributor.</figcaption>
</figure>
<p class="parrafo_grande">The first panel for Contributor registration is a request to
answer the question <em>“Tell us why you want a Contributor account”</em>. Visitors are
not asked
this type of question. For Contributors the responses to this question allow the SYLARD
team to better meet the needs of Contributors. The rest of the entry form is fairly
standard:</p>
<ul class="ul_para_fijas">
<li class="ul_li_para_fijas">name</li>
<li class="ul_li_para_fijas">email</li>
<li class="ul_li_para_fijas">password and password confirmation</li>
<li class="ul_li_para_fijas">country of origin</li>
<li class="ul_li_para_fijas">languages spoken or studied (remember to click on the plus
sign so that the language
is added to the following box: Languages spoken or studied added)</li>
<li class="ul_li_para_fijas">personal statement (optional; again this question is
presented to allow the SYLARD
team to better understand the interests of Contributors)</li>
</ul>
<p class="parrafo_grande"><a href="#figure5">Figure 5</a> shows the completed registration
form with three
languages spoken or studied having been added by clicking the + sign next to the
Languages spoken or studied rectangle. After the form is completed, the potential
Contributor will need to click the Register button at the bottom right of the
Registration screen. A pop-up acknowledgement appears (<a
href="#figure6">fig. 6</a>)
and the Contributor must
click Accept. At this point, the Contributor is notified that an email has been sent to
them (<a href="#figure7">fig. 7</a>). The Contributor should then go to the email
address associated with their
SYLARD account and confirm the request and email by clicking on the link in the email
(<a href="#figure8">fig. 8</a>). This triggers another notification (<a
href="#figure9">fig. 9</a>) that advises the potential
Contributor that their request has been forwarded to the SYLARD administrator (<a
href="#figure10">fig. 10</a>),
who must then authorize the requested Contributor status of the applicant. Once the
administrator has authorized the Contributor status the administrator will see
confirmation of this authorization (<a href="#figure11">fig. 11</a>) and the Contributor
will be sent an email
confirmation of the authorization (<a href="#figure12">fig. 12</a>).</p>
<p class="parrafo_grande">Please continue to <a href="#figure13">figure 13</a> and the
immediately preceding text to
continue reading this manual.</p>
<figure id="figure5">
<a href="images/05_SYLARD-registration-Data-input.jpg"><img
class="imagen_para_estaticas" src="images/05_SYLARD-registration-Data-input.jpg"
alt="Figure 5"></a>
<figcaption><strong>Figure 5:</strong> SYLARD registration screen completed by potential
Contributor</figcaption>
</figure>
<figure id="figure6">
<a href="images/06_SYLARD-Registration-accept-conditions.jpg"><img
class="imagen_para_estaticas"
src="images/06_SYLARD-Registration-accept-conditions.jpg" alt="Figure 6"></a>
<figcaption><strong>Figure 6: </strong>After clicking Register a pop-up screen of Terms
and
Conditions appears and must be accepted</figcaption>
</figure>
<figure id="figure7">
<a href="images/07_SYLARD-Email-sent-to-activate-account.jpg"><img
class="imagen_para_estaticas"
src="images/07_SYLARD-Email-sent-to-activate-account.jpg" alt="Figure 7"></a>
<figcaption><strong>Figure 7: </strong>On the SYLARD page: Notification to a potential
Contributor that an email confirming the application (<a href="#figure8">fig.
8</a>) has been sent to
their account.</figcaption>
</figure>
<figure id="figure8">
<a href="images/08_SYLARD-Email-received-to-activate-account.jpg"><img
class="imagen_para_estaticas"
src="images/08_SYLARD-Email-received-to-activate-account.jpg"
alt="Figure 8"></a>
<figcaption><strong>Figure 8: </strong>SYLARD generated email sent to the user
requesting
activation of a Contributor account.</figcaption>
</figure>
<figure id="figure9">
<a href="images/09_SYLARD-Notificacion-of-registration-in-process.jpg"><img
class="imagen_para_estaticas"
src="images/09_SYLARD-Notificacion-of-registration-in-process.jpg"
alt="Figure 9"></a>
<figcaption><strong>Figure 9: </strong>Confirmation on the SYLARD page that an
application for
Contributor status is being processed.</figcaption>
</figure>
<figure id="figure10">
<a href="images/10_SYLARD-Accept-registration-as-collaborator.jpg"><img
class="imagen_para_estaticas"
src="images/10_SYLARD-Accept-registration-as-collaborator.jpg"
alt="Figure 10"></a>
<figcaption><strong>Figure 10: </strong>Confirmation on the SYLARD page that an
application for
Contributor status is being processed.</figcaption>
</figure>
<figure id="figure11">
<a href="images/11_SYLARD-Acceptance-of-contributor-status.jpg"><img
class="imagen_para_estaticas"
src="images/11_SYLARD-Acceptance-of-contributor-status.jpg" alt="Figure 11"></a>
<figcaption><strong>Figure 11: </strong>Administrator’s panel (seen only by
Administrator) once
the Administrator has approved a request for Contributor status.</strong>
</figcaption>
</figure>
<figure id="figure12">
<a href="images/12_SYLARD-Email-of-acceptance-as-collaborator.jpg"><img
class="imagen_para_estaticas"
src="images/12_SYLARD-Email-of-acceptance-as-collaborator.jpg"
alt="Figure 12"></a>
<figcaption><strong>Figure 12: </strong>Administrator’s panel (seen only by
Administrator) once
the Administrator has approved a request for Contributor status.</strong>
</figcaption>
</figure>
<h3 class="h3_para_fijas" id="stage4">Stage 4: <strong>Log-in and reset password
options</strong></h3>
<p class="parrafo_grande">Once a User has been
authorized as a <em>Contributor</em> they can now log in with this new status. To do so,
they
must go to the SYLARD home screen (<a href="#figure13">fig. 13</a>) and log in
through
the link in the upper
right corner of the topmost light blue header band. By clicking on the Login link the
<em>Contributor</em> is taken to the login page (<a href="#figure14">fig. 14</a>) where
they are asked for their
registered email and password. However, it often occurs that a User (either
<em>Visitor</em> or
<em>Contributor</em>) forgets their password. In such cases SYLARD has an integrated
system to
obtain a temporary password and then reset a permanent password. To do this they must
first click on Forgot password as in <a href="#figure14">figure 14</a>, lower left
corner of the white portion
of the screen.
</p>
<figure id="figure13">
<a href="images/13_SYLARD-Login-after-accepted-as-collaborator.jpg"><img
class="imagen_para_estaticas"
src="images/13_SYLARD-Login-after-accepted-as-collaborator.jpg"
alt="Figure 13"></a>
<figcaption><strong>Figure 13: </strong>SYLARD home page for login.</strong>
</figcaption>
</figure>
<figure id="figure14">
<a href="images/14_SYLARD-Login-as-contributor.jpg"><img class="imagen_para_estaticas"
src="images/14_SYLARD-Login-as-contributor.jpg" alt="Figure 14"></a>
<figcaption><strong>Figure 14: </strong>Login panel in SYLARD with “Forgot password”
option.</strong>
</figcaption>
</figure>
<p class="parrafo_grande">After clicking on the Forgot password? text in blue at the bottom
of <a href="#figure14">figure 14</a>, the User is taken to the online password
reset
module seen in <a href="#figure15">figure 15</a>.
The User must first enter their registered email and then click Submit. A temporary
password is then sent to the registered email (<a href="#figure16">fig. 16</a>). The
Contributor must use this
temporary password to log in (<a href="#figure17">fig. 17</a>). Once logged in, the User
can go to the drop-down
menu in the upper right corner of <a href="#figure18">figure 18</a> and select the
Change password option.
Selecting this option takes the User to the change password screen (<a
href="#figure19">fig. 19</a>) where the
new password must be entered and reentered to confirm.</p>
<p class="parrafo_grande">The text of this manual continues immediately above <a
href="#figure20">figure 20</a>.</p>
<figure id="figure15">
<a href="images/15_SYLARD-Reset-forgotten-password.jpg"><img
class="imagen_para_estaticas"
src="images/15_SYLARD-Reset-forgotten-password.jpg" alt="Figure 15"></a>
<figcaption><strong>Figure 15: </strong>Enter email and submit to obtain a temporary
password
(fig. 16).</strong>
</figcaption>
</figure>
<figure id="figure16">
<a href="images/16_SYLARD-Forgot-emai-provisional-password-reset.jpg"><img
class="imagen_para_estaticas"
src="images/16_SYLARD-Forgot-emai-provisional-password-reset.jpg"
alt="Figure 16"></a>
<figcaption><strong>Figure 16: </strong>Email receipt of temporary password: Copy and
paste this
(fig. 17) to log in to SYLARD.</strong>
</figcaption>
</figure>
<figure id="figure17">
<a href="images/17_SYLARD-Provisional-password-Access.jpg"><img
class="imagen_para_estaticas"
src="images/17_SYLARD-Provisional-password-Access.jpg" alt="Figure 17"></a>
<figcaption><strong>Figure 17: </strong>Copy and paste temporary password to log in to
SYLARD.</strong>
</figcaption>
</figure>
<figure id="figure18">
<a href="images/18_SYLARD-Reset-password-from-provisional.jpg"><img
class="imagen_para_estaticas"
src="images/18_SYLARD-Reset-password-from-provisional.jpg" alt="Figure 18"></a>
<figcaption><strong>Figure 18: </strong>Copy and paste temporary password to log in to
SYLARD.</strong>
</figcaption>
</figure>
<figure id="figure19">
<a href="images/19_SYLARD-Enter-new-password.jpg"><img class="imagen_para_estaticas"
src="images/19_SYLARD-Enter-new-password.jpg" alt="Figure 19"></a>
<figcaption><strong>Figure 19: </strong>Copy and paste temporary password to log in to
SYLARD.</strong>
</figcaption>
</figure>
<h3 class="h3_para_fijas" id="stage5">Stage 5: <strong>Creating a collection</strong></h3>
<p class="parrafo_grande">Once logged in (either with the original or changed password) a
Contributor will be taken to the Catalogue page (<a href="#figure20">fig. 20</a>) if
they have no collections
already in SYLARD. If they have already uploaded annotated audio in one or more
collections they will instead see their My Collections page with the collections listed
(<a href="#figure21">fig. 21</a>). At this point, to add a new collection a new
Contributor can click on Add
Collection from the drop-down menu (<a href="#figure20">fig. 20</a>) whereas
Contributors with a collection or
collections already in SYLARD can click the Add Collection tab located in the purple
header on their My Collections page (<a href="#figure21">fig. 21</a>).</p>
<p class="parrafo_grande">The text of this manual continues above <a href="#figure23">figure
23</a>.</p>
<figure id="figure20">
<a href="images/20_SYLARD-Access-my-collections-to-add-material.jpg"><img
class="imagen_para_estaticas"
src="images/20_SYLARD-Access-my-collections-to-add-material.jpg"
alt="Figure 20"></a>
<figcaption><strong>Figure 20: </strong>Catalogue page through which Contributors access
their
Collections.</strong>
</figcaption>
</figure>
<figure id="figure21">
<a href="images/21_SYLARD-My-collections-Ready-to-add-01.jpg"><img
class="imagen_para_estaticas"
src="images/21_SYLARD-My-collections-Ready-to-add-01.jpg" alt="Figure 21"></a>
<figcaption><strong>Figure 21: </strong>My Collections page presented when a Contributor
with
collections in SYLARD logs in.</strong>
</figcaption>
</figure>
<figure id="figure22">
<a href="images/22_SYLARD-My-collections-Ready-to-add.jpg"><img
class="imagen_para_estaticas"
src="images/22_SYLARD-My-collections-Ready-to-add.jpg" alt="Figure 22"></a>
<figcaption><strong>Figure 22: </strong>My Collections page accessed by new Contributors
from the
drop-down menu on figure 20.</strong>
</figcaption>
</figure>
<p class="parrafo_grande">After clicking on the Add collection option in either <a
href="#figure21">figure 21</a>
(for totally new Contributors) or the Add collection option in <a
href="#figure22">figure
22</a> (for
Contributors with collections already integrated into SYLARD), the Contributor will be
taken to the online Add collection template, <a href="#figure23">figure 23</a>. The
following pages of this
manual explain how this template should be filled in.</p>
<figure id="figure23">
<a href="images/23_SYLARD-Add-collection-panel-page.jpg"><img
class="imagen_para_estaticas"
src="images/23_SYLARD-Add-collection-panel-page.jpg" alt="Figure 23"></a>
<figcaption><strong>Figure 23:</strong> Add collection template as it first appears.
</figcaption>
</figure>
<h4 class="h4_para_fijas"><strong>Title and Description</strong></h4>
<p class="parrafo_grande">The first step is to give the collection a short name and
description. For reasons of economy of space both number of characters in the name
(500 characters) and description (1000 characters) are limited. The name and
description,
along with other information in a My Collection metadatabase can be edited at any time
(see <a href="#figure37">figure 37</a>: Edit metadata).</p>
<p class="parrafo_grande">Note that the collection description is available to any user by
clicking on the circled small letter I (for Information) to the left of the three
vertical dots next to the project name in the catalogue (see <a href="#figure33">fig.
33</a>).</p>
<p class="parrafo_grande">Once the name and description are entered, the Contributor then
proceeds to enter the language data (language group, terminal language, communities
included). This process is illustrated in figures <a href="#figure25">25</a> to <a
href="#figure31">31</a>. The final step is attaching
a license to the new SYLARD collection (<a href="#figure32">fig. 32</a>) At present only
two <a href="https://creativecommons.org/">Creative Commons</a>
licenses are available. In the future other licenses will be added, including TK
(Traditional Knowledge) licenses (see
<a
href="https://localcontexts.org/licenses/traditional-knowledge-licenses">https://localcontexts.org/licenses/traditional-knowledge-licenses</a>).
</p>
<p class="parrafo_grande">The language and community metadata that are added in screenshot
figures <a href="#figure25">25</a> to <a href="#figure31">31</a> are selected from
controlled vocabularies that are derived from
Glottolog (<a href="https://glottolog.org/">https://glottolog.org/</a>) and Mexico’s <a
href="https://www.inegi.org.mx/">INEGI</a> (Instituto Nacional de Estadística
y Geografía) database. This allows auto-fill functionality from a drop-down menu for all
languages and admininistrative units relevant to Mexico.</p>
<p class="parrafo_grande">The Contributor begins by adding what is called the Terminal
language, i.e., the lowest level classification of the language that is documented in
the collection being added to SYLARD.</p>
<h4 class="h4_para_fijas"><strong>Terminal language</strong></h4>
<p class="parrafo_grande">As the contributor starts to type in the terminal language, in
this present case a Mixtec language, after four characters are entered SYLARD provides a
list of Mixtec languages taken from <a href="https://glottolog.org">Glottolog</a> (<a
href="#figure25">fig. 25</a>). The
Contributor can then simply
click on any of the terminal language names in the drop-down menu.</p>
<p class="parrafo_grande">The text of this manual continues immediately above <a
href="#figure28">figure 28</a>.</p>
<figure id="figure24">
<a href="images/24_SYLARD-My-collections-Ready-to-add.jpg"><img
class="imagen_para_estaticas"
src="images/24_SYLARD-My-collections-Ready-to-add.jpg" alt="Figure 24"></a>
<figcaption><strong>Figure 24:</strong> Add collection template with Collection name and
Collection description filled in.
</figcaption>
</figure>
<figure id="figure25">
<a href="images/25_SYLARD-My-collections-Proceso-de-describir-collection-1.jpg"><img
class="imagen_para_estaticas"
src="images/25_SYLARD-My-collections-Proceso-de-describir-collection-1.jpg"
alt="Figure 25"></a>
<figcaption><strong>Figure 25:</strong> Auto-fill of terminal languages based on the
Glottolog catalogue of world languages.
</figcaption>
</figure>
<figure id="figure26">
<a href="images/26_SYLARD-My-collections-Proceso-de-describir-collection-2.jpg"><img
class="imagen_para_estaticas"
src="images/26_SYLARD-My-collections-Proceso-de-describir-collection-2.jpg"
alt="Figure 26"></a>
<figcaption><strong>Figure 26:</strong> Auto-fill of language group based on the
Glottolog catalogue of world languages.
</figcaption>
</figure>
<figure id="figure27">
<a href="images/27_SYLARD-My-collections-Proceso-de-describir-collection-3.jpg"><img
class="imagen_para_estaticas"
src="images/27_SYLARD-My-collections-Proceso-de-describir-collection-3.jpg"
alt="Figure 27"></a>
<figcaption><strong>Figure 27:</strong> Automatic selection of country—Mexico—after
Terminal language and Language group are selected.
</figcaption>
</figure>
<h4 class="h4_para_fijas"><strong>Language group</strong></h4>
<p class="parrafo_grande">Once a terminal language is entered, the language group list for
the pull-down menu is automatically filtered to only show Glottolog language nodes above
the selected terminal language. <a href="#figure26">Figure 26</a> shows the higher level
nodes for Yoloxóchitl
Mixtec: Guerrero Mixtec, Mixtec, Mixtec-Cuicatec, Mixtecan, Amuzgo-Mixtecan, Eastern
Otomanguean, Otomanguean. The Contributor is free to select the node they wish, though
usually a lower-level node is preferable as it groups fairly similar terminal languages
together. <strong>
NOTE: It is necessary to click the plus sign next to Language group to write
Terminal language and Language group to the database
</strong> (see <a href="#figure28">fig. 28</a>: Languages added to
the collection).</p>
<h4 class="h4_para_fijas"><strong>Geography</strong></h4>
<p class="parrafo_grande">This set of metadata items includes Country, Entity (in this case,
state), Municipality, Locality, and Latitude and Longitud. For Mesolex the country is
automatically filled in as “Mexico”. Eventually and if needed Guatemala will be added.
As the country is preselected, the Entity drop-down menu (<a href="#figure28">fig.
28</a>) provides a list of
states that can be selected by clicking on the appropriate entity. In turn, once the
state is selected the Municipality drop-down menu (<a href="#figure29">fig. 29</a>) is
automatically populated
by the municipalities in the state. Finally, after the Municipality is selected the
pull-down menu on locality is filtered for those localities (villages, agencias, etc.)
that INEGI has established for the selected municipality. Once the locality is selected
from the drop-down list, the latitude and longitude are automatically inserted into the
metadata template for this collection. <strong>
NOTE: It is necessary to click the plus sign next
to Longitude to add the geographical information to the database
</strong> (see <a href="#figure32">fig. 32</a>:
Communities added to the collection).</p>
<p class="parrafo_grande">The text of this manual continues immediately below <a
href="#figure31">figure 31</a>.</p>
<figure id="figure28">
<a href="images/28_SYLARD-My-collections-Proceso-de-describir-collection-4.jpg"><img
class="imagen_para_estaticas"
src="images/28_SYLARD-My-collections-Proceso-de-describir-collection-4.jpg"
alt="Figure 28"></a>
<figcaption><strong>Figure 28:</strong> Drop-down presentation of states in Mexico.
</figcaption>
</figure>
<figure id="figure29">
<a href="images/29_SYLARD-My-collections-Proceso-de-describir-collection-5.jpg"><img
class="imagen_para_estaticas"
src="images/29_SYLARD-My-collections-Proceso-de-describir-collection-5.jpg"
alt="Figure 29"></a>
<figcaption><strong>Figure 29:</strong> Municipality drop-down menu that appears after
the State is selected and entered.
</figcaption>
</figure>
<figure id="figure30">
<a href="images/30_SYLARD-My-collections-Proceso-de-describir-collection-6.jpg"><img
class="imagen_para_estaticas"
src="images/30_SYLARD-My-collections-Proceso-de-describir-collection-6.jpg"
alt="Figure 30"></a>
<figcaption><strong>Figure 30:</strong> Locality options in the drop-down menu after
municpality has been selected.
</figcaption>
</figure>
<figure id="figure31">
<a href="images/31_SYLARD-My-collections-Proceso-de-describir-collection-7.jpg"><img
class="imagen_para_estaticas"
src="images/31_SYLARD-My-collections-Proceso-de-describir-collection-7.jpg"
alt="Figure 31"></a>
<figcaption><strong>Figure 31:</strong> Locality options in the drop-down menu after
municpality has been selected.
</figcaption>
</figure>
<h4 class="h4_para_fijas"><strong>Licensing</strong></h4>
<p class="parrafo_grande">The final data point to be entered are the terms for the Content
license (see <a href="#figure32">fig. 32</a>). At present there are only two options,
both are Creative Commons
licenses. As development continues, Traditional knowledge licenses will be added.</p>
<h4 class="h4_para_fijas"><strong>Adding multiple communities to the collection
database</strong></h4>
<p class="parrafo_grande">The steps illustrated in screens 25 to 32 can be repeated within
the same collection to add multiple communities. It is, indeed, often the case that even
collections from individual researchers will include material from multiple nearby
communities. SYLARD can handle this situation. <a href="#figure34">Figure 34</a>
illustates how this will appear
once a total of four communities have been added to the Yoloxóchitl Mixtec collection.
Figures <a href="#figure35">35</a> and <a href="#figure36">36</a> illustrate how the
multiple communities will appear in the catalogue,
in the Communities column to the right. The sliding grey bar to the right of this fourth
column can be moved to show the four communities, listed in alphabetical order: Arroyo
Cumiapa, Buena Vista, Cuanacaxtitlan, and Yoloxóchitl. </p>
<h4 class="h4_para_fijas"><strong>Collection metadata editing and adding new audio</strong>
</h4>
<p class="parrafo_grande">After the collection has been populated with annotated audio, it
is still possible to edit the collection metadata (for editing annotated audio metadata,
see <a href="#figure37">fig. 37</a>). Collection metadata can be edited by a Contributor
at any time simply by
logging in to SYLARD and going to the relevant collection (see, e.g., <a
href="#figure37">fig. 37</a>). By
clicking on the Edit metadata option (the option is in a pop-up window that appears when
the 3 vertical dots are clicked) the Contributor is taken to the Collection metadata
template (<a href="#figure32">fig. 32</a>) from which point the metadata can be
edited
and saved. New annotated
audio can also be added by clicking on the blue rectangle that reads Upload Audio
Annotation. This process is discussed below.</p>
<p class="parrafo_grande">The text of this manual about uploading annotations continues
below <a href="#figure37">figure 37</a>.</p>
<figure id="figure32">
<a href="images/32_SYLARD-My-collections-Proceso-de-describir-collection-8.jpg"><img
class="imagen_para_estaticas"
src="images/32_SYLARD-My-collections-Proceso-de-describir-collection-8.jpg"
alt="Figure 32"></a>
<figcaption><strong>Figure 32:</strong> Collection description online template: Choosing
the collection license.
</figcaption>
</figure>
<figure id="figure33">
<a href="images/33_From-any-audio-access-Collection-description-clicking-I.jpg"><img
class="imagen_para_estaticas"
src="images/33_From-any-audio-access-Collection-description-clicking-I.jpg"
alt="Figure 33"></a>
<figcaption><strong>Figure 33:</strong> Online display of collection description.
</figcaption>
</figure>
<figure id="figure34">
<a href="images/34_SYLARD-Add-additional-localities-to-a-collection.jpg"><img
class="imagen_para_estaticas"
src="images/34_SYLARD-Add-additional-localities-to-a-collection.jpg"
alt="Figure 34"></a>
<figcaption><strong>Figure 34:</strong> Collection with multiple communities within one
terminal language.
</figcaption>
</figure>
<figure id="figure35">
<a href="images/35_Listo-para-agregar-audios.jpg"><img class="imagen_para_estaticas"
src="images/35_Listo-para-agregar-audios.jpg" alt="Figure 35"></a>
<figcaption><strong>Figure 35:</strong> Catalogue display (four columns of metadata)
with multiple communities displayed in the fourth column with sliding bar.
</figcaption>
</figure>
<figure id="figure36">
<a
href="images/36_Entrar-a-la-coleccion-Nota-que-esta-coleccion-tiene-varias-comunidades.jpg"><img
class="imagen_para_estaticas"
src="images/36_Entrar-a-la-coleccion-Nota-que-esta-coleccion-tiene-varias-comunidades.jpg"
alt="Figure 36"></a>
<figcaption><strong>Figure 36:</strong> Catalogue display with multiple communities
displayed in fourth column with sliding bar.
</figcaption>
</figure>
<figure id="figure37">
<a href="images/37_Edit-metadatos-by-collaborator-3-dots-at-side.jpg"><img
class="imagen_para_estaticas"
src="images/37_Edit-metadatos-by-collaborator-3-dots-at-side.jpg"
alt="Figure 37"></a>
<figcaption><strong>Figure 37:</strong> Collection metadata editing option: Click on 3
vertical dots for pop-up window.
</figcaption>
</figure>
<h3 class="h3_para_fijas" id="stage6">Stage 6: <strong>Uploading annotated audio to a
collection</strong>
</h3>
<p class="parrafo_grande">The final step in creating a collection is uploading time-coded
ELAN files to the SYLARD server (which converts the XML ELAN format to HTLM for online
display and line-by-line playback) and at the same time linking the annotation to the
corresponding audio in mp3 format on a secure (https) server. The home screen for
uploading and converting ELAN files (XML to HTML) and linking to .mp3 audios is accessed
by clicking the Upload Audio Annotation button on the My Collections page (<a
href="#figure37">fig. 37</a>,
lower right corner in the purple banner). If there are multiple collections the upload
is begun by clicking on the three vertical dots to the right of the collection to which
audio will be added (<a href="#figure37">fig. 37</a>, pop-up window that offers the
Contributor three options: Upload Audio Annotation, Edit metadata, Erase).</p>
<h4 class="h4_para_fijas">Step 1: <strong>Selecting an ELAN file for uploading</strong></h4>
<p class="parrafo_grande">The first step is to choose an ELAN file on a local computer:
Click Choose File (<a href="#figure38">fig. 38</a>) and navegate to the desired file and
click Open (<a href="#figure39">fig. 39</a>).
This will produce and lead the Contributor to the screen displayed in <a
href="#figure40">figure 40</a> into
which the Contributor will enter the title, description, metadata and default display of
the line-by-line playback of the selected audio annotation.</p>
<figure id="figure38">
<a href="images/38_Pantalla-inicial-de-vincular-anotaciones-en-ELAN-a-un-audio.jpg"><img
class="imagen_para_estaticas"
src="images/38_Pantalla-inicial-de-vincular-anotaciones-en-ELAN-a-un-audio.jpg"
alt="Figure 38"></a>
<figcaption><strong>Figure 38:</strong> Home screen for creating line-by-line playback
of annotated (transcribed, translated) audio.
</figcaption>
</figure>
<figure id="figure39">
<a href="images/39_Choose-ELAN-file-from-local-machine.jpg"><img
class="imagen_para_estaticas"
src="images/39_Choose-ELAN-file-from-local-machine.jpg" alt="Figure 39"></a>
<figcaption><strong>Figure 39:</strong> Selection ELAN annotation for uploading to
SYLARD.
</figcaption>
</figure>
<h4 class="h4_para_fijas">Step 2: <strong>Linking the ELAN annotation to an mp3 file, adding
a title and description for the playback screen</strong></h4>
<p class="parrafo_grande">Once the ELAN file is uploaded to SYLARD and the corresponding
Upload audio and annotation screen is generated (<a href="#figure40">fig. 40</a>), the
second step is for the
Contributor to enter the complete URL path to the mp3 file annotated in the uploaded
ELAN file. The path must be complete and the .mp3 sound file must be on a secure (https)
server. Note that even though the ELAN annotation was from a .wav file, for Internet
playback a derived .mp3 should be used. The Contributor must then type in a Title of the
audio (limited to 120 characters) and a Description of the audio (limited to 200
characters).</p>
<p class="parrafo_grande"><strong>Note that the Contributor can include HTML tags</strong>
(<i> and
<b>) in both the Title and Description of the audio. These will be represented
when
the audio and annotation are viewed online (see <a href="#figure45">fig. 45</a>,
for example). Note that the
Mixtec name, <i>itun³ yu¹ku¹ nda’³a⁴ ki³ti⁴</i> was
entered in roman text
with
the HTML
tag <i> surrounding the Yoloxóchitl Mixtec name. It is also important to note
that all
special characters such as superscript numbers or letters must be entered as
Unicode
characters. For example, superscripts ¹, ², ³, and ⁴ have the
following hex
codes in
Unicode: 00b9, 00b2, 00b3, 2074.</p>
<figure id="figure40">
<a href="images/40_After-file-is-selected-page-for-metadata-input.jpg"><img
class="imagen_para_estaticas"
src="images/40_After-file-is-selected-page-for-metadata-input.jpg"
alt="Figure 40"></a>
<figcaption><strong>Figure 40:</strong> Screenshot of upload template after having
selected and uploaded an ELAN file.
</figcaption>
</figure>
<h4 class="h4_para_fijas">Step 3: <strong>A second set of metadata includes the following
(<a href="#figure40">fig. 40</a>)</strong></h4>
<ul class="ul_para_fijas">
<li class="ul_li_para_fijas">Collection in which the audio is included;</li>
<li class="ul_li_para_fijas">Community of the speakers;</li>
<li class="ul_li_para_fijas">Terminal language of the speakers;</li>
<li class="ul_li_para_fijas">Genre of the recording.</li>
</ul>
<p class="parrafo_grande">The Contributor first selects the Collection in which the audio is
included. Many if not most of the Contributors will have uploaded only one collection.
For cases in which a Contributor has multiple collections, the drop-down menu for this
metadata item will display all the collections that the Contributor has created.
Contributors may add audio to a collection at any time, a particularly relelvant
functionality given that Contributors may continually generate new audio for any given
collection.</p>
<p class="parrafo_grande">Once the “Collection in which the audio is included” is selected,
the following two metadata fields will be provided with a drop-down menu that contains
the communities and languages that were included in the Collection metadata when the
collection was originally created. As evident in <a href="#figure42">figure 42</a>, the
drop-down menu displays
the same 4 communities that were originally included (<a href="#figure34">fig. 34</a>).
The Contributor can
click on the community relevent to the uploaded audio. Likewise, the Terminal language
will have a drop-down list when applicable. However, most collections will have only one
terminal language.</p>
<p class="parrafo_grande">The final bit of metadata is taken from a controlled vocabulary of
the genres of the recordings. The options, which are still only a preliminary list, are
visible in the drop-down menu at the mid-right section of <a href="#figure41">figure
41</a>. For the file about
Godmania aesculifolia, the genre Ethnobotany/Etnobotánica was selected. In the next
version of SYLARD this genre metadata will allow users to suggest new classifications.
SYLARD will also allow users to filter content by particular topics across multiple
language collections in SYLARD, creating a theme-specific multilanguague corpus.</p>
<p class="parrafo_grande">Text of this manual continues below <a href="#figure42">figure
42</a>.</p>
<figure id="figure41">
<a href="images/41_Metadata-input-01-Top.jpg"><img class="imagen_para_estaticas"
src="images/41_Metadata-input-01-Top.jpg" alt="Figure 41"></a>
<figcaption><strong>Figure 41:</strong> Screenshot of top half of the upload template
(with metadata).
</figcaption>
</figure>
<figure id="figure42">
<a href="images/42_Metadata-for-audio-01-collection-community.jpg"><img
class="imagen_para_estaticas"
src="images/42_Metadata-for-audio-01-collection-community.jpg"
alt="Figure 42"></a>
<figcaption><strong>Figure 42:</strong> Metadata for audio annotations: Collection,
Community, Terminal language, Genre.
</figcaption>
</figure>
<h4 class="h4_para_fijas">Step 4: <strong>Creation of default display of annotations (e.g.,
transcriptions) for line‑by‑line playback</strong></h4>
<p class="parrafo_grande">The final step in uploading audio annotations is the selection of
a default format for (1) where the annotations are displayed (one‑line display or
scrolling box) and (2) for the font colors. The template for this selection process is
created during the upload of the original ELAN file: server‑based SYLARD software
reads
the file and extracts the speakers and the tiers of annotation (<a href="#figure41">fig.
41</a>: Screenshot of
upload template (with metadata)). Note the following:</p>
<ul class="ul_para_fijas">
<li class="ul_li_para_fijas"><strong>Speakers:</strong> The top line of each group of
tiers is the name of the speaker for the group of tiers listed immediately below. In
the present case the two speakers are Esteban Castillo García and Constantino
Teodoro Bautista. This control allows the Contributor to withhold from the default
display the complete annotations for any speaker. It will also allow users to hide
any speaker by using the Visual options (see below).</li>
<li class="ul_li_para_fijas"><strong>Tiers:</strong> In the present case E. Castillo
García has five tiers of annotation (visible in <a href="#figure41">fig. 41</a>)
while C. Teodoro Bautista
has four (not visible in the <a href="#figure41">fig. 41</a> screenshot). The
Contributor can individually
select whether to show or hide each tier in the default view, the view that users
see when they access line-by-line playback. Note that these same users (be they
Visitors or Contributors) can activate the Visual options (<a href="#figure46">fig.
46</a>) and change, for
their viewing, which tiers are shown or hidden, regardless of whether the tier was
hidden or displayed in the default presentation. The user-activated Visual options
control is discussed below in reference to <a href="#figure46">fig. 46</a>.</li>
<li class="ul_li_para_fijas"><strong>View in:</strong> The SYLARD display or play-back
template
comprises two sections:
<ul class="ul_para_fijas">
<li class="ul_li_para_fijas_2nivel">One-line display</li>
<li class="ul_li_para_fijas_2nivel">Scrolling</li>
</ul>
<a href="#figure45">Figure 45</a> illustrates these two display sections: One-line
display and Scrolling.
The one-line display is located below the sound bar and between two thin horizontal
orange lines. In this particular case there are two Mixtec orthographies, the top is
a practical orthography and the bottom is a surface linguistic orthography. The
scrolling section contains the Spanish translation of the Mixtec text. As the
recording progresses the one-line display changes as the recording reaches each new
line of annotation. In the scrolling section, as the audio progresses the grey
shaded highlighting moves down the translation, also line-by-line.
</li>
<li class="ul_li_para_fijas"><strong>Font color</strong>: Finally, the Contributor can
select the color of the text annotation of each tier. There are two ways to select
font color. The first is to enter the hex value of the color in the rectangle next
to the color square, which changes color as the hex values are changed. The second
way to select font color is through a color picker (see <a href="#figure44">fig.
44</a>). The possibilities
with the picker are more limited. But the advantage of the color picker is the ease
with which it allows consistency in font color across many different audio
annotations uploaded by a Contributor at different times.</li>
</ul>
<h4 class="h4_para_fijas">Step 5: <strong>Creation of default display of annotations (e.g.,
transcriptions) for line‑by‑line playback</strong></h4>
<p class="parrafo_grande">Once all the metadata and default display selections are entered,
the Contributor needs to click on Save (bottom right of figs. <a href="figure43">43</a>
or <a href="#figure44">44</a>). This preserves
the metadata used in the default playback view (<a href="figure45">fig. 45</a>) and
available to users who wish
to take advantage of the Visible options functionality (<a href="#figure46">fig.
46</a>).</p>
<figure id="figure43">
<a href="images/43_Metadata-input-02-Bottom.jpg"><img class="imagen_para_estaticas"
src="images/43_Metadata-input-02-Bottom.jpg" alt="Figure 43"></a>
<figcaption><strong>Figure 43:</strong> Screenshot of upload template, bottom half, for
default display of the annotations.
</figcaption>
</figure>
<h3 class="h3_para_fijas" id="stage7">Stage 7: <strong>Setup viewer </strong>
</h3>
<p class="parrafo_grande">This final stage presents the user experience in viewing and
playing back annotated (transcribed, translated, and annotated) audio through SYLARD.
Any registered user (Visitor or Contributor) can access the SYLARD catalogue, select a
collection and audio to hear, and go to the playback page (<a href="#figure45">fig.
45</a>). The initial
appearance of the line-by-line playback module is determined by how the Contributor
created the metadata and display format discussed in Stage 6: Uploading annotated audio
to a collection.</p>
<p class="parrafo_grande">Upon accessing an annotated audio, the user is taken to a page
such as that in <a href="#figure45">figure 45</a>. The sound is played by clicking on
the right-pointing
triangle at the left of the playback bar. Clicking on the three vertical dots to the
right of the playback bar allows users to control the playback speed and to download the
mp3. A future enhancement will allow downloading of ELAN and HTML annotation files.</p>
<p class="parrafo_grande">Visual options: SYLARD also allows users to personally configure
the annotation display during playback. This is done by expanding the Visual options
function at the top left of the playbar. In uploading an ELAN annotation file, a
Contributor sets the default playback view. In the present case (fig. 45) two
orthographic representations (practical and surface, in the reddish font transcriptions
below the playbar) appear in the one-line section of the SYLARD playback page. The
Spanish translation, on the other hand, appears in the scroll box just under the
one-line display of the Mixtec texts. The highlighted line of the translation changes as
the audio progresses, and the Mixtec transcriptions change as well, line by line as the
recording progresses.</p>
<h4 class="h4_para_fijas"><strong>Visual options</strong></h4>
<p class="parrafo_grande">SYLARD also allows users to personally configure the annotation
display during playback. This is done by expanding the Visual options function at the
top left of the playbar. In uploading an ELAN annotation file, a Contributor sets the
default playback view. In the present case (<a href="#figure45">fig. 45</a>) two
orthographic representations
(practical and surface, in the reddish font transcriptions below the playbar) appear in
the one-line section of the SYLARD playback page. The Spanish translation, on the other
hand, appears in the scroll box just under the one-line display of the Mixtec texts. The
highlighted line of the translation changes as the audio progresses, and the Mixtec
transcriptions change as well, line by line as the recording progresses.
Text of this manual continues below <a href="#figure45">figure 45</a>.
</p>
<figure id="figure44">
<a href="images/44_Metadata-color-picker.jpg"><img class="imagen_para_estaticas"
src="images/44_Metadata-color-picker.jpg" alt="Figure 44"></a>
<figcaption><strong>Figure 44:</strong> Default display: Choosing the font color for
each tier.
</figcaption>
</figure>
<figure id="figure45">
<a href="images/45-Viewer-experience.jpg"><img class="imagen_para_estaticas"
src="images/45-Viewer-experience.jpg" alt="Figure 45"></a>
<figcaption><strong>Figure 45:</strong> Default display: Choosing the font color for
each tier.
</figcaption>
</figure>
<p class="parrafo_grande">Visual options can be personalized by each user. The changes in
the visual presentation of annotated files are temporary and specific to the user who
makes them. A future enhancement to SYLARD will be to create accounts in which users can
store the display preferences that they have created, file by file.</p>
<p class="parrafo_grande">The default values for playback are automatically displayed in the
expanded Visual options screen (<a href="#figure46">fig. 46</a>). Note that three tiers
were uploaded but hidden
from display: Esteban García Castillo GLOSS, Esteban García Castillo PARSE, and
Constantino Teodoro Bautista PARSE. Indeed, users can easily see which tiers have been
uploaded but are not visible in the default view by opening the Visual options screen
(<a href="#figure46">fig. 46</a>) and noting the tiers with Off in the Show column.
Three tiers were hidden
(uploaded but not displayed) while six lines of annotation appear in the default view
(<a href="#figure45">fig. 45</a>, in which four of these tiers appear; not shown are the
practical and surface
orthographies of Contantino Teodoro Bautista, which will appear in the One-line view
once the recording reaches his text). With the Visual options function, a user who
wishes to see any of these lines of text, however, can slide the switch to On and then
select where the newly revealed tier will be displayed (One-line display or Scrolling)
and the font color in which it will appear.</p>
<figure id="figure46">
<a href="images/46_Visual-options-to-customize-user-by-user.jpg"><img
class="imagen_para_estaticas"
src="images/46_Visual-options-to-customize-user-by-user.jpg"
alt="Figure 46"></a>
<figcaption><strong>Figure 46:</strong> User activated visual options for changing
SYLARD display for a particular audio annotation.
</figcaption>
</figure>
<p class="parrafo_grande"><a href="#figure47">Figure 47</a> illustrates the immediately
visible impact of
user-defined custom views. In this image the user has opened the Visual options menu and
has changed the display.</p>
<ul class="ul_para_fijas">
<li class="ul_li_para_fijas">Surface orthography is now hidden (both for Esteban
Castillo García and Constantino Teodoro Bautista);</li>
<li class="ul_li_para_fijas">The practical orthography transcription for both speakers
is now represented in the Scrolling box;</li>
<li class="ul_li_para_fijas">The translation for both speakers is now represented in the
Scrolling box, immediately below the Mixtec transcription;</li>
<li class="ul_li_para_fijas">The user has changed the font colors (cf. fig. <a
href="#figure45">45</a> and fig. <a href="#figure47">47</a>)</li>
</ul>
<p class="parrafo_grande">The changes are immediately reflected in the annotation display:
Note that the Mixtec annotation and Spanish translation are intercalated one before the
other in the scroll box, with new font colors.</p>
<p class="parrafo_grande">As an example, many users might prefer the practical orthographic
and translation to be viewed one immediately above the other, in order to easily
associate one with the other. This would mean that both are displayed in the scrolling
box and that the colors should be selected to maximize contrast. The user who
reconfigured the display in the Visual options panel for <a href="#figure47">figure
47</a> desired this effect;
the change has been immediately implemented but only for this particular user. For other
users, the default remains as the initial view upon accessing this audio annotation. As
already noted, a planned future development will be user accounts in which personalized
Visual options can be stored as desired so that in reopening a file at a later date, the
reconfigured display appears as the “default”.</p>
<figure id="figure47">
<a href="images/47_Visual-options-implemented.jpg"><img class="imagen_para_estaticas"
src="images/47_Visual-options-implemented.jpg" alt="Figure 47"></a>
<figcaption><strong>Figure 47:</strong> Line-by-line playback display after Visual
options have been implemented by a user.
</figcaption>