cms_project/index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>chatty, messy, sticky, tsss...In Habitat</title>
    <link rel="stylesheet" href="index.css" media="only screen" />
    <link
      rel="stylesheet"
      media="only screen and (min-device-width : 1190px) and (max-device-width : 1440px)"
      href="./laptop_s.css"
    />
  </head>
  <body>
    <div class="container">
      <div class = "titletext">
        <h1 class = "title">chatty, messy, sticky, <span id="tsss" class = "title">tsss</span>...</h1>
        <h4>A diary from Habitat (Tredozio, IT), August 2022</h4>
      </div>
      

      <div class="diary">
        <div class="part part1" >
          <p>
            "Yesterday I published something. Ah wait, not 'I', I mean 'we'. I
            was with 11 other people and we made our own little book then bound
            everything together. Pfff... it was not easy to bind all the
            different pieces into one, because everyone made various contents
            with different intentions. We were so chatty thus it was chaotic.
            But we persistently and stubbornly stayed together. In the end, what
            we created was a heavy-fat-ugly-cute book thingy."
          </p>
        </div>

         <div class="part part2">
          <img src="./img/book1_1024.png" />
         </div>

        <div class="part part3" >
          <img src="./img/pancake.jpg" />
        </div>

         <div class="part part4">
          <p>
        "3, 2, 1, Yayyyy! We
            cheered and celebrated our collaborative Buchimgae (Korean pancake)
            cooking. Sharing one Buchimage altogether, we tore it into pieces.
            It was GOOD. The pancake batter was a glue, as it hugged all the
            ingredients. Looking back, cooking was also a glue, because we
            became closer in the end. Tssss... the sizzle, the chatty and the
            festive sounds still lingers in my ears..."
          </p>
         </div>
      </div>

      <div class = "transition"><p>.</p><p>.</p><p>.</p></div>

      <div class="cartoon">
        <div class="cut cut1">
          <div class="ani"><img src="./img/ex.jpg" /></div>
          <div class="text">
            <p>Rotterdam to Eindhoven, Eindhoven to Bologna, Bologna to Faenza, Faenza to Tredozio...<br>
              Our journey from the Netherlands to Italy was made through winding roads. When we landed to <a href ="https://habitattt.it/">Habitat</a>,
              the sky was colored into orange.</p>
          </div>
        </div>

        <div class="cut cut2">
          <div class="ani"><img src="./img/bibi_768.jpg" /></div>
          <div class="text">
            <p>
              Our friend Jacopo (a.k.a Pongie) and a kitten Bilbi, a mascot of Habitat, welcomed us with open arms.
            </p>
          </div>
        </div>
        <div class="cut cut3">
          <div class="ani"><img src="./img/wasp_1024.jpg" /></div>
          <div class="text">
            <p>Ah yea, a group of wasps as well! </p>
          </div>
        </div>

        <div class="cut cut3a">
          <div class="ani"><img src="./img/habitat_process2.jpg" /></div>
          <div class="text">
            <p>Our first workshop <i>chatty, messy, sticky, tsss...</i> was planned to happen two days later.
            What we wanted to do with artists in Habitat is creating a temporary platform to make collective publications into two different formats;<br> 
             1) a format of a book through relay binding<br>
            2) a format of a dish: <span id="Buchimgae">Buchimgae</span
              ><span id="Buchimgaepic"> <img src="./img/buchimgae_s.png" /></span
              ><span id="expl">Buchimage is Korean pancake.</span>, mixing (= gluing = binding) various ingredients.</p>
          </div>
        </div>

        <div class="intro intro1">
          <h4>The collective book binding (step-by-step):</h4>
          <p>
            a-1) introduce what we're going to do; part one relay book binding (10-15m):<br>

Start from our title and unpack the (background) story of the workshop idea. Let participants know that the workshop will recorded as soundscape and ask if they're okay with it.<br><br>


a-2) Play around with tools: (15m)<br>
Before get into the binding session, participants have 15 minutes to play around with the prepared tools. They can touch and use a few of them and will have the sense of materiality. 
Participants sit around a table and each of them has a specific role. (e.g. Person A cuts papers, person B punches holes, person C tapes, person D folds, etc). Through the relayed tasks, they will make collaborative publication(s). During the session, they will share their thoughts and discuss the collective values in the action of binding.
<br><br>
a-3) Select a tool for each person and explain why they chose it. (10m)<br>
Give them a few minutes to select a tool/a role they want, and have a short round to listen to the reasons.
Have a brief overview for the outcome and share thoughts.<br><br>
a-4) A brief discussion for the arrangement of seat positions (10-20m) 
: Let them think about orders/mechanisms they want to have<br><br>
a-5)The relay binding moment! (45m) While waiting for one's turn, there will be continuous daily conversation.<br><br> 
a-6) Wrap up (10m):<br>
A round of feeling and touching the outcome. Then have a 3 minutes of cool-down moment to think how they want to name/define the outcome. Then let them write it down on sticky notes/paper (prepared by the hosts) and put them on the outcome (pub).

[BREAK] The 1st session done! 30mins tea-time / prepare the next workshop; Buchimgae making
          </p>
        </div>

        <div class = "cut cut3b">
          <div class="ani"><img src = "./img/workshop_pic.jpg"></div>
          <div class="text">
            <p>
              It's the D-day! The 28th Aug 2022, 5PM<br>Participants were very respectfully listening to our introduction.
            </p>
            </div>
        </div>

        <div class = "cut cut3c">
          <div class="ani" id = "taping">
            <img src = "./img/taping-recording_1024.jpg">
          </div>
          <div class = "enrico">
            <img src = "./img/binding_pic.jpg">
          </div>
          <div class="text">
            <p> Tssssss...... Taping sounds!<br>
              People were busy with making their own page! 
            </p>
          </div>
        </div>

        <div class="cut cut4">
          <div class="ani"><img src="./img/binding_1024.jpg" /></div>
          <div class="text">
            <p>
              Yea...We remeber... The rustle of papers being cut, torn out, sticked....
            </p>
          </div>
        </div>

        <div class="cut cut5">
          <div class="ani" id = "collectivebind">
            <img src="./img/binding-2_1024.jpg" />
          </div>
          <div class = "bindtogether">
            <img src ="./img/bind-together.jpg">
          </div>
          <div class="text">
            <p>
              When it seemed that people almost finishsed making their pages, we wanted to start the relay binding.<br>
              Starting from a page, it was becoming a book. Getting thicker and thicker...
            </p>
          </div>
        </div>

        <div class="cut cut6">
          <div class="ani"><img src="./img/label_book_1024.jpg" /></div>
          <div class="text">
            <p>Tada!!! Completed!<br>
              We asked for the participants to label how they want to name/call it.
            </p>
          </div>
        </div>

        <div class="intro intro2">
          <h4>Cooking Buchimgae together (step-by-step):</h4>
          <p>        
            b-1) Ask ppl to explain what ingredients they brought (if they haven't brought any, then grab whatever in the fridge and ask them why they chose it)<br>
            b-2) Introduce what we're going to do; what is Buchimgae,<BR> In Korea, we count the number of Buchimgae as if we count paper. We call it like Buchimgae 1 jang (=page), 2 jang...<br> 
            
            b-3) Split into a few groups. Each group makes their own Buchimgae, mixing various ingredients.<br>
            b-4) When mixing the ingredients, use batter that the hosts prepared. They will be mingled together.<br> 
            b-4) Have a special ceremony to eat Buchimgae, which is tearing it all together :) (Normally a page of Buchimgae is supposed to be had together.<br> 
            b-5) Just enjoying it!
          </p>
        </div>

        <div class="cut cut7">
          <div class="ani" id = "chaeexp"><img src="./img/chae-explain_768.jpg" /></div>
          <div class = "chaepic">
            <img src ="./img/chae_pic.jpg">
          </div>
          <div class="text">
            <p>
              Before starting the cooking session, we explained what Buchimgae is. We tried to let them know that the pancake can be an experimental format of a publication.
              In Korea, the number of Buchimgae is counted as a page (of a book). We call it like Buchimgae 1,2,3 jang (=page)...
            </p>
          </div>
        </div>

        <div class="cut cut8">
          <div class="ani"><img src="./img/floor-tomato_768.jpg" /></div>
          <div class="text">
            <p>
              Floor, one of the participants, were cutting a tomato! That was juicy.
            </p>
          </div>
        </div>

        <div class="cut cut9">
          <div class="ani"><img src="./img/buchimgae-making_1024.jpg" /></div>
          <div class="text">
            <p>
             Another group seemed to create a concept of their pancake as a scenery of Tredozio. The orange sky and green fields...
            </p>
          </div>
        </div>

        <div class="cut cut10">
          <div class="ani" id = "compo"><img src="./img/compositing_768.jpg" /></div>
          <div class = "compopic">
            <img src ="./img/pancake.jpg">
          </div>
          <div class="text">
            <p>
            A group with Floor and Pongie decorated theirs in a super elegant way. It was just like a plate served from a high-end fine dining restaurant.
            </p>
          </div>
        </div>

        <div class="cut cut11">
          <div class="ani" id="bilbiface"><img src="./img/bibi-pancake_768.jpg" /></div>
          <div class = "bilbi">
            <img src ="./img/bibi-pancake_pic.jpg">
          </div>
          <div class="text">
            <p>
             Haha, Lino and Illo created a pancake with the face of Bilbi! Would Bilbi know this?
            </p>
          </div>
        </div>

        <div class="cut cut12">
          <div class="ani"><img src="./img/lino-ilo_768.jpg" /></div>
          <div class="text">
            <p>
              Another pancake with their names written! It was quite a statement :)
            </p>
            
          </div>
        </div>

        <div class = "cut cut13">
          <div class = "ani"><img src = "./img/pongie-explaining_1024.jpg"></div>
          <div class="text">
            <p>
              Every group finished their pancakes. We all gathered into a dining room. Pongie was so passionate to present the pancake of his group.
            </p>
          </div>
        </div>

        <div class = "cut cut14">
          <div class = "ani">
            <img src = "./img/i-have-great-idea_1024.jpg" id = "pongieidea">
          </div>

          <div class="text">
            <p>
              I have a great idea!?
            </p>
          </div>
        </div>

        <div class = "cut cut14">
          <div class = "ani">
            <img src = "./img/tearing-sharing_1024.jpg">
          </div>
          <div class="text">
            <p>
              3, 2, 1, Yayyyyy!!!! We tored a pancake together!
            </p>
          </div>
        </div>  

    </div>
    <script src="./app.js"></script>
  </body>
</html>
newstart 2 years ago			`<!DOCTYPE html>`
			`<html lang="en">`
			`<head>`
			`<meta charset="UTF-8" />`
			`<meta name="viewport" content="width=device-width, initial-scale=1.0" />`
			`<meta http-equiv="X-UA-Compatible" content="ie=edge" />`
text and layout change 2 years ago			`<title>chatty, messy, sticky, tsss...In Habitat</title>`
newstart 2 years ago			`<link rel="stylesheet" href="index.css" media="only screen" />`
added more illustration but still testing 2 years ago			`<link`
newstart 2 years ago			`rel="stylesheet"`
			`media="only screen and (min-device-width : 1190px) and (max-device-width : 1440px)"`
added more illustration but still testing 2 years ago			`href="./laptop_s.css"`
			`/>`
newstart 2 years ago			`</head>`
			`<body>`
			`<div class="container">`
only layout. i havent started working on text yet 2 years ago			`<div class = "titletext">`
			`<h1 class = "title">chatty, messy, sticky, <span id="tsss" class = "title">tsss</span>...</h1>`
			`<h4>A diary from Habitat (Tredozio, IT), August 2022</h4>`
			`</div>`

add our diary text 2 years ago
			`<div class="diary">`
only layout. i havent started working on text yet 2 years ago			`<div class="part part1" >`
add our diary text 2 years ago			`<p>`
			`"Yesterday I published something. Ah wait, not 'I', I mean 'we'. I`
			`was with 11 other people and we made our own little book then bound`
			`everything together. Pfff... it was not easy to bind all the`
			`different pieces into one, because everyone made various contents`
			`with different intentions. We were so chatty thus it was chaotic.`
			`But we persistently and stubbornly stayed together. In the end, what`
			`we created was a heavy-fat-ugly-cute book thingy."`
			`</p>`
			`</div>`
only layout. i havent started working on text yet 2 years ago
			`<div class="part part2">`
			`<img src="./img/book1_1024.png" />`
			`</div>`

			`<div class="part part3" >`
			`<img src="./img/pancake.jpg" />`
			`</div>`

			`<div class="part part4">`
add our diary text 2 years ago			`<p>`
only layout. i havent started working on text yet 2 years ago			`"3, 2, 1, Yayyyy! We`
add our diary text 2 years ago			`cheered and celebrated our collaborative Buchimgae (Korean pancake)`
			`cooking. Sharing one Buchimage altogether, we tore it into pieces.`
			`It was GOOD. The pancake batter was a glue, as it hugged all the`
			`ingredients. Looking back, cooking was also a glue, because we`
			`became closer in the end. Tssss... the sizzle, the chatty and the`
			`festive sounds still lingers in my ears..."`
			`</p>`
only layout. i havent started working on text yet 2 years ago			`</div>`
add our diary text 2 years ago			`</div>`

only layout. i havent started working on text yet 2 years ago			`<div class = "transition"><p>.</p><p>.</p><p>.</p></div>`

			`<div class="cartoon">`
			`<div class="cut cut1">`
			`<div class="ani"><img src="./img/ex.jpg" /></div>`
			`<div class="text">`
			`<p>Rotterdam to Eindhoven, Eindhoven to Bologna, Bologna to Faenza, Faenza to Tredozio...<br>`
text and layout change 2 years ago			`Our journey from the Netherlands to Italy was made through winding roads. When we landed to <a href ="https://habitattt.it/">Habitat</a>,`
			`the sky was colored into orange.</p>`
only layout. i havent started working on text yet 2 years ago			`</div>`
			`</div>`

			`<div class="cut cut2">`
			`<div class="ani"><img src="./img/bibi_768.jpg" /></div>`
			`<div class="text">`
			`<p>`
text and layout change 2 years ago			`Our friend Jacopo (a.k.a Pongie) and a kitten Bilbi, a mascot of Habitat, welcomed us with open arms.`
only layout. i havent started working on text yet 2 years ago			`</p>`
			`</div>`
			`</div>`
			`<div class="cut cut3">`
			`<div class="ani"><img src="./img/wasp_1024.jpg" /></div>`
			`<div class="text">`
text and layout change 2 years ago			`<p>Ah yea, a group of wasps as well! </p>`
			`</div>`
			`</div>`

			`<div class="cut cut3a">`
			`<div class="ani"><img src="./img/habitat_process2.jpg" /></div>`
			`<div class="text">`
			`<p>Our first workshop <i>chatty, messy, sticky, tsss...</i> was planned to happen two days later.`
			`What we wanted to do with artists in Habitat is creating a temporary platform to make collective publications into two different formats;<br>`
			`1) a format of a book through relay binding<br>`
			`2) a format of a dish: <span id="Buchimgae">Buchimgae</span`
			`><span id="Buchimgaepic"> <img src="./img/buchimgae_s.png" /></span`
			`><span id="expl">Buchimage is Korean pancake.</span>, mixing (= gluing = binding) various ingredients.</p>`
only layout. i havent started working on text yet 2 years ago			`</div>`
added new illustration and adjusted layout 2 years ago			`</div>`

only layout. i havent started working on text yet 2 years ago			`<div class="intro intro1">`
text and layout change 2 years ago			`<h4>The collective book binding (step-by-step):</h4>`
added new illustration and adjusted layout 2 years ago			`<p>`
text and layout change 2 years ago			`a-1) introduce what we're going to do; part one relay book binding (10-15m):<br>`

			`Start from our title and unpack the (background) story of the workshop idea. Let participants know that the workshop will recorded as soundscape and ask if they're okay with it.<br><br>`
only layout. i havent started working on text yet 2 years ago
text and layout change 2 years ago
			`a-2) Play around with tools: (15m)<br>`
			`Before get into the binding session, participants have 15 minutes to play around with the prepared tools. They can touch and use a few of them and will have the sense of materiality.`
			`Participants sit around a table and each of them has a specific role. (e.g. Person A cuts papers, person B punches holes, person C tapes, person D folds, etc). Through the relayed tasks, they will make collaborative publication(s). During the session, they will share their thoughts and discuss the collective values in the action of binding.`
			`<br><br>`
			`a-3) Select a tool for each person and explain why they chose it. (10m)<br>`
			`Give them a few minutes to select a tool/a role they want, and have a short round to listen to the reasons.`
			`Have a brief overview for the outcome and share thoughts.<br><br>`
			`a-4) A brief discussion for the arrangement of seat positions (10-20m)`
			`: Let them think about orders/mechanisms they want to have<br><br>`
			`a-5)The relay binding moment! (45m) While waiting for one's turn, there will be continuous daily conversation.<br><br>`
			`a-6) Wrap up (10m):<br>`
			`A round of feeling and touching the outcome. Then have a 3 minutes of cool-down moment to think how they want to name/define the outcome. Then let them write it down on sticky notes/paper (prepared by the hosts) and put them on the outcome (pub).`

			`[BREAK] The 1st session done! 30mins tea-time / prepare the next workshop; Buchimgae making`
added new illustration and adjusted layout 2 years ago			`</p>`
			`</div>`
only layout. i havent started working on text yet 2 years ago
			`<div class = "cut cut3b">`
			`<div class="ani"><img src = "./img/workshop_pic.jpg"></div>`
			`<div class="text">`
			`<p>`
text and layout change 2 years ago			`It's the D-day! The 28th Aug 2022, 5PM<br>Participants were very respectfully listening to our introduction.`
only layout. i havent started working on text yet 2 years ago			`</p>`
			`</div>`
added new illustration and adjusted layout 2 years ago			`</div>`

only layout. i havent started working on text yet 2 years ago			`<div class = "cut cut3c">`
text and layout change 2 years ago			`<div class="ani" id = "taping">`
			`<img src = "./img/taping-recording_1024.jpg">`
			`</div>`
			`<div class = "enrico">`
			`<img src = "./img/binding_pic.jpg">`
			`</div>`
only layout. i havent started working on text yet 2 years ago			`<div class="text">`
text and layout change 2 years ago			`<p> Tssssss...... Taping sounds!<br>`
			`People were busy with making their own page!`
only layout. i havent started working on text yet 2 years ago			`</p>`
			`</div>`
			`</div>`
added new illustration and adjusted layout 2 years ago
only layout. i havent started working on text yet 2 years ago			`<div class="cut cut4">`
text and layout change 2 years ago			`<div class="ani"><img src="./img/binding_1024.jpg" /></div>`
only layout. i havent started working on text yet 2 years ago			`<div class="text">`
			`<p>`
text and layout change 2 years ago			`Yea...We remeber... The rustle of papers being cut, torn out, sticked....`
only layout. i havent started working on text yet 2 years ago			`</p>`
			`</div>`
added new illustration and adjusted layout 2 years ago			`</div>`

only layout. i havent started working on text yet 2 years ago			`<div class="cut cut5">`
text and layout change 2 years ago			`<div class="ani" id = "collectivebind">`
			`<img src="./img/binding-2_1024.jpg" />`
			`</div>`
			`<div class = "bindtogether">`
			`<img src ="./img/bind-together.jpg">`
only layout. i havent started working on text yet 2 years ago			`</div>`
			`<div class="text">`
			`<p>`
text and layout change 2 years ago			`When it seemed that people almost finishsed making their pages, we wanted to start the relay binding.<br>`
			`Starting from a page, it was becoming a book. Getting thicker and thicker...`
only layout. i havent started working on text yet 2 years ago			`</p>`
			`</div>`
added new illustration and adjusted layout 2 years ago			`</div>`
only layout. i havent started working on text yet 2 years ago
			`<div class="cut cut6">`
			`<div class="ani"><img src="./img/label_book_1024.jpg" /></div>`
			`<div class="text">`
text and layout change 2 years ago			`<p>Tada!!! Completed!<br>`
			`We asked for the participants to label how they want to name/call it.`
only layout. i havent started working on text yet 2 years ago			`</p>`
			`</div>`
added new illustration and adjusted layout 2 years ago			`</div>`

only layout. i havent started working on text yet 2 years ago			`<div class="intro intro2">`
text and layout change 2 years ago			`<h4>Cooking Buchimgae together (step-by-step):</h4>`
			`<p>`
			`b-1) Ask ppl to explain what ingredients they brought (if they haven't brought any, then grab whatever in the fridge and ask them why they chose it)<br>`
			`b-2) Introduce what we're going to do; what is Buchimgae,<BR> In Korea, we count the number of Buchimgae as if we count paper. We call it like Buchimgae 1 jang (=page), 2 jang...<br>`

			`b-3) Split into a few groups. Each group makes their own Buchimgae, mixing various ingredients.<br>`
			`b-4) When mixing the ingredients, use batter that the hosts prepared. They will be mingled together.<br>`
			`b-4) Have a special ceremony to eat Buchimgae, which is tearing it all together :) (Normally a page of Buchimgae is supposed to be had together.<br>`
			`b-5) Just enjoying it!`
added new illustration and adjusted layout 2 years ago			`</p>`
			`</div>`
newstart 2 years ago
only layout. i havent started working on text yet 2 years ago			`<div class="cut cut7">`
text and layout change 2 years ago			`<div class="ani" id = "chaeexp"><img src="./img/chae-explain_768.jpg" /></div>`
			`<div class = "chaepic">`
			`<img src ="./img/chae_pic.jpg">`
			`</div>`
only layout. i havent started working on text yet 2 years ago			`<div class="text">`
			`<p>`
text and layout change 2 years ago			`Before starting the cooking session, we explained what Buchimgae is. We tried to let them know that the pancake can be an experimental format of a publication.`
			`In Korea, the number of Buchimgae is counted as a page (of a book). We call it like Buchimgae 1,2,3 jang (=page)...`
only layout. i havent started working on text yet 2 years ago			`</p>`
			`</div>`
			`</div>`
added new illustration and adjusted layout 2 years ago
only layout. i havent started working on text yet 2 years ago			`<div class="cut cut8">`
			`<div class="ani"><img src="./img/floor-tomato_768.jpg" /></div>`
			`<div class="text">`
			`<p>`
text and layout change 2 years ago			`Floor, one of the participants, were cutting a tomato! That was juicy.`
only layout. i havent started working on text yet 2 years ago			`</p>`
			`</div>`
nami first sketch no soundyet 2 years ago			`</div>`
added new illustration and adjusted layout 2 years ago
only layout. i havent started working on text yet 2 years ago			`<div class="cut cut9">`
			`<div class="ani"><img src="./img/buchimgae-making_1024.jpg" /></div>`
			`<div class="text">`
			`<p>`
text and layout change 2 years ago			`Another group seemed to create a concept of their pancake as a scenery of Tredozio. The orange sky and green fields...`
only layout. i havent started working on text yet 2 years ago			`</p>`
			`</div>`
nami first sketch no soundyet 2 years ago			`</div>`
newstart 2 years ago
only layout. i havent started working on text yet 2 years ago			`<div class="cut cut10">`
text and layout change 2 years ago			`<div class="ani" id = "compo"><img src="./img/compositing_768.jpg" /></div>`
			`<div class = "compopic">`
			`<img src ="./img/pancake.jpg">`
			`</div>`
only layout. i havent started working on text yet 2 years ago			`<div class="text">`
			`<p>`
text and layout change 2 years ago			`A group with Floor and Pongie decorated theirs in a super elegant way. It was just like a plate served from a high-end fine dining restaurant.`
only layout. i havent started working on text yet 2 years ago			`</p>`
			`</div>`
nami first sketch no soundyet 2 years ago			`</div>`
added new illustration and adjusted layout 2 years ago
only layout. i havent started working on text yet 2 years ago			`<div class="cut cut11">`
text and layout change 2 years ago			`<div class="ani" id="bilbiface"><img src="./img/bibi-pancake_768.jpg" /></div>`
			`<div class = "bilbi">`
			`<img src ="./img/bibi-pancake_pic.jpg">`
			`</div>`
only layout. i havent started working on text yet 2 years ago			`<div class="text">`
			`<p>`
text and layout change 2 years ago			`Haha, Lino and Illo created a pancake with the face of Bilbi! Would Bilbi know this?`
only layout. i havent started working on text yet 2 years ago			`</p>`
			`</div>`
nami first sketch no soundyet 2 years ago			`</div>`
added new illustration and adjusted layout 2 years ago
only layout. i havent started working on text yet 2 years ago			`<div class="cut cut12">`
			`<div class="ani"><img src="./img/lino-ilo_768.jpg" /></div>`
			`<div class="text">`
			`<p>`
text and layout change 2 years ago			`Another pancake with their names written! It was quite a statement :)`
only layout. i havent started working on text yet 2 years ago			`</p>`
text and layout change 2 years ago
only layout. i havent started working on text yet 2 years ago			`</div>`
nami first sketch no soundyet 2 years ago			`</div>`
added more illustration but still testing 2 years ago
only layout. i havent started working on text yet 2 years ago			`<div class = "cut cut13">`
			`<div class = "ani"><img src = "./img/pongie-explaining_1024.jpg"></div>`
			`<div class="text">`
			`<p>`
text and layout change 2 years ago			`Every group finished their pancakes. We all gathered into a dining room. Pongie was so passionate to present the pancake of his group.`
only layout. i havent started working on text yet 2 years ago			`</p>`
			`</div>`
nami first sketch no soundyet 2 years ago			`</div>`
only layout. i havent started working on text yet 2 years ago
			`<div class = "cut cut14">`
			`<div class = "ani">`
text and layout change 2 years ago			`<img src = "./img/i-have-great-idea_1024.jpg" id = "pongieidea">`
only layout. i havent started working on text yet 2 years ago			`</div>`

			`<div class="text">`
			`<p>`
text and layout change 2 years ago			`I have a great idea!?`
only layout. i havent started working on text yet 2 years ago			`</p>`
			`</div>`
			`</div>`

			`<div class = "cut cut14">`
			`<div class = "ani">`
			`<img src = "./img/tearing-sharing_1024.jpg">`
			`</div>`
			`<div class="text">`
			`<p>`
text and layout change 2 years ago			`3, 2, 1, Yayyyyy!!!! We tored a pancake together!`
only layout. i havent started working on text yet 2 years ago			`</p>`
			`</div>`
			`</div>`

newstart 2 years ago			`</div>`
added more illustration but still testing 2 years ago			`<script src="./app.js"></script>`
newstart 2 years ago			`</body>`
			`</html>`