Section 2. Writing the Web


Remix My Schedule

Made by Mozilla Learning Networks.

Learners will remix HTML code to change the words on a website, learning about composing for the web and remix.

45 minutes to an hour

  • Preparation

    Do the activity on your own to become familiar with it. Make sure your technology works as expected across a few test machines.

    You may also wish to set up an account on teach.mozilla.org that you can share with your learners. This will save time later when they are ready to publish their remixes.

    Review this definition of the word "Remix", so that you can help your learners (and colleagues!) understand what it means to remix a make.

    Clear out enough space in your learning environment to let your learners to move around and partner up together.

    Post the URL, or Web address, of today's make somewhere highly visible in your room. You may want to post it as a shortened link using a service like bit.ly.

  • 10
    min

    Introduction

    Welcome your students and explain that in this activity we're going to remix a traditional school schedule in a playful way. Give each student a notecard and a pen or pencil. Explain that part of remix is finding a creative way to add to, switch around, or replace something that inspires your creativity. To begin, we're going to explore the idea of the 'best class ever' together.

    • Give each student a notecard and pen or pencil.

    • Ask learners to take 3-5 minutes to brainstorm the best class ever. This first brainstorm should be done individually.

    • Help learnes by using your computer to project prompts like, "What does that class sound like?", or "What do you see when you walk into that class?", or "Who is there?", or, "What do you make in that class?"

    • Invite students to draw the class instead of writing about it, and help scribe for any students who find it difficult to describe the class in writing.

    • After 3-5 minutes of brainstorming, partner up your learners using a simple count-off or other random sorting technique.

    • Ask learners to share their brainstorms with one another and to add ideas using 'yes/and.' Explain that after the first partner shares, the second partner should add something positive to the idea by saying, "Yes! And [new idea]", to affirm the first idea and contribute to it.

    • Next, ask students to repeat the "yes/and" process with the second partner's idea.

    • Once everyone has had a chance to share with their partners, ask students to sit at their computers and go to the webpage for today's activity.

  • 30
    min

    Remix My Schedule

    Explore Remix My Schedule

    Explain that this page is made in Mozilla's Thimble Web editor. This means that students can hit the green "Remix" button in the upper right-hand corner of the screen to change all sorts of things on the page, including its title, text, and images.

    Ask students to explore the Remix My Schdule activity by reading the page alone or with a partner.

    Then ask students to hit the Remix button.

    Explain that after students hit the Remix button, Thimble will show them the code for the wbepage, as well as the CSS, or styling code, that makes the webpage work. Explain that CSS stands for 'cascading stylesheet.' Explain also that HTML, the language of the Web, shapes the page while CSS tells the parts of the page how to look.

    Tell students that today we're going to remix a class schedule playfully and creatively so that our usual, traditional classes become fantastic instead - just like our best classes ever.

    Answer any questions your students ask.

    Remix the make

    Guide learners around the Thimble interface using your computer and projector. Point out the sidebard to the left that has the main page called index.html, as well as the other files used in the web page, including the CSS file called style.css.

    Also show your learners that they can hit the 'Tutorial' tab on the right side of the screen to switch their view from the webpage to a self-guided tutorial that takes them through the remix activity.

    Run through the tutorial yourself at a baseline pace for the class and do a 'think-aloud' as you work. Speak your thoughts as you navigate and change the code.

    Invite eager students to move through the tutorial at their own pace.

    Use the tutorial and your think-aloud to support students and loop back to any difficult areas.

    After 20 minutes or so of working through the tutorial, each student should have remixed and changed

    • The title of the page on the index.html page.

    • The names of the classes on the index.html page.

    • The credits at the bottom of the index.html page.

    Gauge students' engagement with remixing other parts of the page, like style.css, and either end this part of the activity a bit early or extend time for students to continue working.

    Share

    Publish your remix. Invite your students to hit the 'Publish' button in the upper right-hand corner of their remix when they finish. Thimble will give them a URL, or Web address, to visit andf share with friends.

    Take it a step further. Invite to check out the style.css file in the left sidebar and to see what happens when they change values there.

  • 20
    min

    Reflect and review

    Give students about 5-10 minutes to visit one another's machines or to swap Web addresses to see what other learners came up with in their remixes.

    Ask volunteers to share some of their newly remixed schedules with the class.

    Facilitate a brief, reflective discussion about composing, coding, and remixing using questions like

    • What seemed easiest or most difficult about remixing the page today?

    • Do you think you'd be better off in life following a traditional schedule or the one you invented today? Why?

    • Could any of your ideas from today's remix turn into class projects or clubs? How could you make one of your ideas come true? What would you need? Who could help?