WebPCDGirona/index.html at master · CreativeCodingGirona/WebPCDGirona · GitHub

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
<!DOCTYPE html>
<html lang="ca">

<head>
  <title>Processing Community Day 2019 | Girona</title>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link href="https://fonts.googleapis.com/css?family=Source+Code+Pro:300,400,600" rel="stylesheet">
  <link href="./css/main.css" rel="stylesheet">

</head>
<body>
  <div class="wrapper">
    <header class="header">
      <img class="header-logo" src="https://res.cloudinary.com/nucliweb/image/upload/c_scale,w_200/v1547831150/PCDGirona/PCD.png" alt="Processing Community Day">
      <h1 class="header-text">Processing Community Day 2019 Girona</h1>
      <video class="logo-coding-girona" autoplay loop muted width="256" height="256">
        <source src="https://res.cloudinary.com/nucliweb/video/upload/v1548062024/PCDGirona/G-white.mp4">
      </video>
    </header>
    <section>
      <p>
        <strong><a href="https://day.processing.org/" target="_blank">Processing Community Day</a></strong> és un esdeveniment que se celebra a diferents ciutats per tot el món, entre els dies 15 de gener i 15 de febrer de 2019.
      </p>
      <p>
        El pròxim dia <strong>9 de febrer</strong> Girona serà una d'aquestes ciutats, més concretament al <a href="https://www.tecnoateneu.cat/" target="_blank">Tecnoateneu de Vilablareix</a>, on podrem gaudir d'un dia per aprendre a programar, conèixer el llenguatge de programació <a href="http://processingjs.org/" target="_blank">Processing</a> i Javascript amb <a href="http://p5js.org/" target="_blank">P5.js</a>, així com conèixer eines
        i llibreries de Processing i P5.js per crear peces creatives i interactives.
      </p>
    </section>

    <h2>Agenda</h2>
    <section>
      <h3 class="agenda-session">Matí <span>xerrades i exposicions</span></h3>
      <p>Començarem el dia amb una sèrie de xerrades per conèixer què és Processing i amb quin objectiu es va crear, a més de veure alguns exemples interactius.</p>
      <ul class="timeline">
        <li class="timeline-item">
          <h4 class="timeline-item_title">
            <span class="timeline-item_hour">10:00</span>
            Què és Processing?
            <span class="timeline-item_speaker">Joan León</span>
          </h4>
          <p class="timeline-item_desc">
            Processing és una plataforma gratuïta i de codi obert per l'ùs i aprenentatge de la programació en el context de les arts visuals. Coneixerem els seus inicis i tot l'ecosistema que hi ha actualment al seu voltant. <a href="#inscriptions">Inscriu-te</a></p>
        </li>
        <li class="timeline-item">
          <h4 class="timeline-item_title">
            <span class="timeline-item_hour">11:00</span>
            Processing + llibreríes open source
            <span class="timeline-item_speaker">Victor Martin</span>
          </h4>
          <p class="timeline-item_desc">
            El software lliure ens posa a l'abast milers de paquets llestos per integrar i fer servir dins els nostres projectes. En aquesta xerrada veurem com buscar, instal.lar i utilitzar llibreríes open source als nostres projectes Processing per (gairebé) obtenir superpoders ;) <a href="#inscriptions">Inscriu-te</a> </p>
        </li>
        <li class="timeline-item">
          <h4 class="timeline-item_title">
            <span class="timeline-item_hour">12:00</span>
            P5.js & WebMIDI
            <span class="timeline-item_speaker">Dani Herrera</span>
          </h4>
          <p class="timeline-item_desc">
            "Web MIDI té el potencial de ser una de les tecnologies del món de la música més disruptiva en molt de temps, potser tan disruptiva com ho va ser originalment MIDI el 1983.". A la xerrada es mostrarà com capturar els events d'un dispositiu USB Midi per tenir-los disponibles al nostre projecte P5.js. <a href="#inscriptions">Inscriu-te</a> </p>
        </li>
        <li class="timeline-item">
          <h4 class="timeline-item_title">
            <span class="timeline-item_hour">13:00</span>
            Exposicions i demos
          </h4>
          <p class="timeline-item_desc">
            Posarem a la vostra disposició alguns equips per tal que podeu gaudir una estona de l'art creatiu, amb imatge i música. <a href="#inscriptions">Inscriu-te</a> </p>
        </li>
        <li class="timeline-item">
          <h4 class="timeline-item_title">
            <span class="timeline-item_hour">14:00</span>
            Fi de la sessió del matí
          </h4>
        </li>
      </ul>
      </section>

      <section>
      <h3 class="agenda-session">Tarda <span>tallers</span></h3>
      <p>La millor manera d'aprendre qualsevol cosa és practicant. Després de les xerrades del matí, dedicarem la tarda a fer un parell de tallers on aprendrem les bases de <strong>P5.js</strong>, i com fer servir la webcam per al reconeixement de figures humanes.</p>
      <p class="hightlight">Per participar als tallers cal que porteu el vostre portàtil.</p>

      <ul class="timeline">
        <li class="timeline-item">
          <h4 class="timeline-item_title">
            <span class="timeline-item_hour">15:30</span>
            Jugant amb P5.js
            <span class="timeline-item_speaker">Carmen Ansio</span>
          </h4>
          <p class="timeline-item_desc">
            P5 és una biblioteca de JavaSript que fa accesible el codi creatiu a principiants/artistes per poder crear gràfics i animacions amb art generatiu.
            És la millor combinació del llenguatge de programació Processing amb el món de possibilitats que avui en dia dona la web.
            Al taller podrem aprendre com funciona P5.js i en un tres i no res crearem exemples des de 0 basats en creacions d’artistes fets a la web. <a href="#inscriptions">Inscriu-te</a> </p>
          <p class="timeline-item_hightlight">Aquest taller està adreçat a nens i nenes a partir de 10 anys i no cal tenir experiència prèvia, ja que començarem des del més bàsic.</p>
        </li>
        <li class="timeline-item">
          <h4 class="timeline-item_title">
            <span class="timeline-item_hour">17:00</span>
            PoseNet, reconeixement de la figura humana amb Machine Learning
            <span class="timeline-item_speaker">Joan León</span>
          </h4>
          <p class="timeline-item_desc">
            En aquest taller farem servir la llibreria de <strong>Machine Learning</strong> <a href="https://ml5js.org" target="_blank">ml5.js</a> per reconèixer la figura humana fent servir la webcam del nostre ordinador. Pot semblar complex, però no patiu, seguirem una sèrie de passes preestablertes i passarem una bona estona. <a href="#inscriptions">Inscriu-te</a> </p>
          <p class="timeline-item_hightlight">Aquest taller està adreçat per a totes les edats, i no cal tenir experiència prèvia, ja que seguirem el taller pas a pas.</p>
        </li>
      </ul>
    </section>

    <h2>Ponents</h2>

    <section class="speakers">
      <div class="speaker">
        <div class="speaker-avatar">
          <div id="carmenGlitch"  class="speaker-image"></div>
          <h4 class="speaker-name">Carmen Ansio <span class="speker-pippe">|</span> <a href="https://twitter.com/carmenansio" target="_blank">@carmenansio</a></h4>
        </div>
        <div class="speaker-bio">
            <p>Treballo al departament de ConsumerExperience (CX) de Desigual, com UX/UI Engineer. Fa 3 anys vaig fer el salt del disseny gràfic al desenvolupament web i em vaig enamorar perdudament del CSS, del Codi creatiu i les animacions amb SVGs. Vaig participar com co-host a <a href="https://twitter.com/wecodesign" target="_blank">@wecodesign</a>, podcast quinzenal sobre desenvolupament i disseny web. Também vaig ser integrant de <a href="https://twitter.com/adabcnjs" target="_blank">@adabcnjs</a>, comunitat de dones que té com a objectiu promoure i donar suport al creixement del sector femení en l’àmbit (IT) a través del desenvolupament web. L’experiència va ser tan enriquidora que em vaig animar a participar sent ponent en diversos esdeveniments com, Codemotion, BilboStack i Women Techmakers Asturias.</p>
        </div>
      </div>
      <div class="speaker">
        <div class="speaker-avatar">
          <div id="daniGlitch"  class="speaker-image"></div>
          <h4 class="speaker-name">Dani Herrera <span class="speker-pippe">|</span> <a href="https://twitter.com/ctrl_alt_d" target="_blank">@ctrl_alt_d</a></h4>
        </div>
        <div class="speaker-bio">
            <p>Enginyer en Informàtica (FiB). Actualment treballo per a la Universitat de Girona com a Desenvolupador Sènior. Assidu a les trobades de <a href="https://pythongirona.cat/">Python Girona</a> i d'<a href="https://github.com/InformaticsEmporda/Xerrades">Informàtics Empordà</a>. Col·laboro amb la comunitat des d'StackOverflow així com participant en projectes, tallers i xerrades relacionades amb el codi obert.</p>
        </div>
      </div>
      <div class="speaker">
        <div class="speaker-avatar">
          <div id="joanGlitch"  class="speaker-image"></div>
          <h4 class="speaker-name">Joan León <span class="speker-pippe">|</span> <a href="https://twitter.com/nucliweb" target="_blank">@nucliweb</a></h4>
        </div>
        <div class="speaker-bio">
            <p>Actualment treballo com a Developer Advocate a <a href="https://www.schibsted.es/" target="_blank">Schibsted Spain</a>, sóc un enamorat del CSS, SVG i l'animació web, m'apassiona tot el relacionat amb el desenvolupament i interacció UI a entorns web. Altres de les meves passions son col·laborar a projectes Open Source i l'art amb codi (Creative Coding). M'encanta compartir coneixement a MeetUps, conferències, tallers, com a docent a <a href="https://escuela.it/teacher/joan-leon" target="_blank">Escuela IT</a>, o recenment com a "Youtuber" a <a href="https://perf.reviews/" target="_blank">Perf Reviews</a>... sempre actiu a <a href="https://twitter.com/nucliweb" target="_blank">@nucliweb</a> compartint recursos i novetats del món web, i ara com a membre a <a href="https://twitter.com/CodingGirona" target="_blank">Creative Coding Girona</a>.</p>
        </div>
      </div>
      <div class="speaker">
        <div class="speaker-avatar">
          <div id="victorGlitch"  class="speaker-image"></div>
          <h4 class="speaker-name">Victor Martin <span class="speker-pippe">|</span> <a href="https://twitter.com/victormartin" target="_blank">@victormartin</a></h4>
        </div>
        <div class="speaker-bio">
            <p>Actualment treballo com a Director de Tecnologia (CTO) per <a href="https://www.ibroker.es" target="_blank">www.ibroker.es</a>, on puc desenvolupar dues de les meves passions: Open Source Software & Quantitative Hedge Funds. A més del meu treball diari, imparteixo <a href="http://www2.udg.edu/Guiadematricula/Dissenyassignatura/tabid/15700/Default.aspx?codia=3105G07032" target="_blank">Qualitat del programari</a> al Grau d'Informàtica als alumnes d'últim any a la <a href="https://www.udg.edu/ca/directori/pagina-personal?ID=147045" target="_blank">Universitat de Girona</a>.</p>
        </div>
      </div>
    </section>

    <h2 id="inscriptions">Inscripcions</h2>

    <section>
      <iframe src="https://docs.google.com/forms/d/e/1FAIpQLSckBFxul37oJUjPa3VSrfU1kav99rCtod10-NVGJdNbwVcOKA/viewform?embedded=true" width="100%" height="1100px"; frameborder="0"></iframe>
    </section>

    <h2>Agraïments</h2>

    <section>
      <p>Volem donar les gràcies a <strong><a href="https://www.tecnoateneu.cat/" target="_blank">Tecnoateneu</a></strong> i a <strong><a href="
      http://www.vilablareix.cat/" target="_blank">l'Ajuntament de Vilablareix</a></strong> per la cessió de l'espai. I com no, a la <strong><a href="https://processingfoundation.org" target="_blank">Fundació Processing</a></strong> per oferir-nos l'oportunitat de formar part d'aquest esdeveniment a escala mundial.</p>
    </section>

    <h2>Organització</h2>

    <section>
      <p>A Creative Coding Girona, aprofitem aquest event per promoure l'art creatiu amb les tecnologies. Segueix-nos a <strong><a href="https://twitter.com/CodingGirona" target="_blank">@CodingGirona</a></strong> per estar informat de futurs esdeveniment.</p>
    </section>

  </div>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.3/p5.min.js"></script>
  <script src="js/main.js"></script>
  <!-- Global site tag (gtag.js) - Google Analytics -->
  <script async src="https://www.googletagmanager.com/gtag/js?id=UA-132739347-1"></script>
  <script>
    window.dataLayer = window.dataLayer || [];
    function gtag() { dataLayer.push(arguments); }
    gtag('js', new Date());

    gtag('config', 'UA-132739347-1');
  </script>
  <!-- <script src="https://cdn.logrocket.io/LogRocket.min.js" crossorigin="anonymous"></script>
  <script>window.LogRocket && window.LogRocket.init('pdyjaq/pcdgirona');</script> -->
</body>
</html>