workshop-materials/index.html at master · strategictransparency/workshop-materials · 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
<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Creative Resistance Workshop Prompts</title>
    <link rel="stylesheet" href="styles.css">
  </head>
  <body>
    <div id="home">
      <div class ="title">✨ Creative Resistance Workshop 🌈</div>
      <div class="subtitle">facilitated by <a href="https://roopavasudevan.com" target="_blank">roopa vasudevan</a><br>
      on behalf of the <a href="https://strategictransparencycollective.net" target="_blank">strategic transparency collective</a><br>
      as part of the 2021 <a href="https://www.commonfield.org/">common field</a> convening:<br>
      <a href="https://www.commonfield.org/convenings/4496/information" target="_blank">sustaining futures</a><br></div>
    </div>
    <div class="section" id="s1">
      <div class="title">We are...</div>
      <div class="text">
        <p>who are you? how do you identify yourself? who do you see yourself as? this can range from individual basics regarding age, race, gender, nationality, occupation, ability, and socioeconomic status, all the way to more nebulous, inclusive and imaginative descriptors.</p>
      </div>
    </div>
    <div class="section" id="s2">
      <div class="title">In our practices, we...</div>
      <div class="text">
        <p>how would you describe your practice? how do you engage with technology? what do you use technology for? what do you use art for?</p>
      </div>
    </div>
    <div class="section" id="s3">
      <div class="title">We see resistance as...</div>
      <div class="text">
        <p>what do you see as the purpose of creative resistance? how do you engage with resistance, critique or subversion in your own practice? what other artists to you draw inspiration from when you think of this? what do you hope your own resistance will lead to?</p>
      </div>
    </div>
    <div class="section" id="s4">
      <div class="title">We are concerned by...</div>
      <div class="text">
        <p>this is the time to look critically at both your own practice, as well as creative resistance as a whole. where are the holes and flaws? where might you unintentionally be reinforcing oppressive power structures? what could you be doing better? what could other artists be doing better?</p>
      </div>
    </div>
    <div class="section" id="s5">
      <div class="title">We refuse...</div>
      <div class="text">
        <p>what DON’T you want? what are the dealbreakers? where do you draw the line? what will you never engage in your work?</p>
      </div>
    </div>
    <div class="section" id="s6">
      <div class="title">We want...</div>
      <div class="text">
        <p>in your vision of the future, what do you want? what do you want your artwork and actions to lead to? what are the goals for your work’s impact on the world?</p>
      </div>
    </div>
    <div class="section" id="s7">
      <div class="title">We commit to...</div>
      <div class="text">
        <p>what are actions you can take now, in your own practice, to address the flaws and criticisms you listed earlier? what do you resolve to do? where can you make changes in how you work, and what changes can you advocate for other artists to make?</p>
      </div>
    </div>
    <div id="documentLink">
      <div class="title"><a href="https://board.net/p/resistance-manifesto">https://board.net/p/resistance-manifesto</a></div>
      <div class="manifesto-subtitle">
        <p>We’ll edit this document together!</p>
      </div>
    </div>
    <div id="thanks">
      <div class ="title">💖 thank you 💖</div>
      <div class="subtitle"><a href="https://roopavasudevan.com">roopavasudevan.com</a> / <a href="https://instagram.com/rouxpz">@rouxpz</a><br>
      <a href="mailto:hello@roopavasudevan.com">hello@roopavasudevan.com</a><br><a href="mailto:hello@strategictransparencycollective.net">hello@strategictransparencycollective.net</a></div>
      <div id="postscript"><p>If you would like to lead this workshop yourself, you can download the materials from here: <a href="https://github.com/strategictransparency">https://github.com/strategictransparency</a></p>
      <p>There are only two requirements: 1) compensate your participants if you have the means to do so, and 2) contribute your final manifestos to the <a href="https://github.com/strategictransparency/manifesto">GitHub repository</a> when they're done.</p></div>
    </div>
    <div id="next"><button class="button" onclick="advanceSlide()" type="button" name="button">>>></button></div>
    <div id="homeButton"><button class="button" onclick="returnToStart()" type="button" name="button">Return to Start</button></div>

    <script type="text/javascript">
      var state = 0;
      var padding = 2;
      var originals = ['We are...', 'In our practices, we...', 'We see resistance as...', 'We are concerned by...', 'We refuse...', 'We want...', 'We commit to...'];
      var replacements = ['I am...', 'In my practice, I...', 'I see resistance as...', 'I am concerned by...', 'I refuse...', 'I want...', 'I commit to...'];

      function advanceSlide() {
        state++;
        var sections = document.getElementsByClassName('section');
        var text = document.getElementsByClassName('text');

        // console.log(text);

        if (state === 1) {
          document.getElementById('home').style.display = 'none';
          for (var i = 0; i < sections.length; i++) {
            // console.log(sections[i].children[0]);
            sections[i].style.display = "block";
            text[i].style.display = "none";
          }
        } else if (state > 1 && state <= 8) {
          stateText = 's' + (state - 1);
          console.log(stateText);
          for (var i = 0; i < sections.length; i++) {
            if (sections[i].id != stateText) {
              sections[i].style.display = 'none';
            } else if (state > 1) {
              // sections[i-1].style.display = 'block';
              padding += 2;
              // console.log(padding);
              var toReplace = sections[i].children[0].innerHTML;
              var overallIndex = originals.indexOf(toReplace);
              sections[i].children[0].innerHTML = replacements[overallIndex];
              sections[i].style.display = 'block';
              sections[i].style.paddingTop = '' + padding + '%';
              var children = sections[i].children;
              for (j = 0; j < children.length; j++) {
                children[j].style.display = "block";
              }
            }
          }
        } else if (state === 9) {
          for (var i = 0; i < sections.length; i++) {
            sections[i].style.display = "none";
          }
          document.getElementById('documentLink').style.display = 'block';
        } else {
          document.getElementById('documentLink').style.display = 'none';
          document.getElementById('next').style.display = 'none';
          document.getElementById('thanks').style.display = 'block';
          document.getElementById('homeButton').style.display = 'block';
        }
      }

      function returnToStart() {
        state = 0;
        padding = 2;
        var sections = document.getElementsByClassName('section');

        document.getElementById('home').style.display = 'block';
        document.getElementById('next').style.display = 'block';
        document.getElementById('thanks').style.display = 'none';
        document.getElementById('homeButton').style.display = 'none';

        for (var i = 0; i < sections.length; i++) {
          sections[i].style.paddingTop = '0%';
          sections[i].children[0].innerHTML = originals[i];
        }

      }

    </script>
  </body>
</html>