Web Literacy Basics II | Welcome to My Mixtape

• 1. Preparation

  Learning Progression

  In this lesson, your learners will:

  1. Learn how to make music using online tools.
  2. Make and save music online.
  3. Upload music to Soundcloud.
  4. Remix this Thimble project to create mixtapes of their songs.
  5. Reflect on their learning.
  6. Optional: Make an album cover for their songs, upload it, and put it on their mixtape page.

  ---

  You should...

  Do the activity on your own to become familiar with it. Click through the links in the activity and try to make one or two of the suggested projects using the instructions you find online.

  1. Follow this link to the Thimble project for this activity.
  2. Click on the green "Remix" button in the upper right-hand corner of the window to go into the project's code.
  3. Click on the "Tutorial" pane next to the "Preview" pane in the upper right-hand corner of the coding window.
  4. Follow the steps in the tutorial to complete the activity. You may also need to check back here and complete some of the steps in this lesson plan to successfully finish the Thimble project.

  You can also try this module on embedding media in a webpage from the Mozilla Developer Network Learning Area.

  You may also wish to set up an account (or several) on both Soundcloud and teach.mozilla.org that you can share with your learners.

  Review this definition of the word "Remix" so that you can help your learners (and colleagues!) understand that they can remix their projects to customize or improve them.

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

• 2. Introduction

  15 minutes

  Welcome your learners and begin by asking them what "mixtape" means to them. On a computer attached to a projector - or on a whiteboard or large piece of paper - record learners' answers so everyone can see their ideas.

  Next, ask learners where the word "mixtape" came from. Let learners pair up and search for answers online for about 5 minutes. Ask them to find at least two or three online definitions that go together and back up their answers.

  Bring the group back together and ask learners to share what they found about mixtapes. Record their answers next to their answers about what "mixtape" means to them today.

  Invite your learners to compare their answers. Ask them how the definition of "mixtape" has changed over time. Draw learners' attention to similarities and differences between their initial definitions and the historical origin of "mixtape." Ask them what apps and Web services today remind them of the old definition of "mixtape" as a playlist.

  Ask learners how mixtapes looked in the past and how they look today. Ask learners if any of them have ever made a cassette or CD mixtape for themselves or a friend.

  Point out that when people used to make mixtapes, they used analog, physical cassettes to create playlists of different songs from different artists one-tape-at-a-time for a specific audience, like a bestie, but that today people can use digital media to make "mixtapes" of their own music to share online to a much larger audience.

  If you have time and another learning objective in mind about, say, the history of technology or the changing nature of language over time, take another 15-20 minutes and ask pairs of learners to summarize their comparisons of "old school" and "new school" mixtapes on a large piece of poster paper.

  Once every group has had a chance to share its poster, ask learners to sit at their computers and go to the webpage for today's activity.

• 3. Making Music on the Web

  45 minutes

  Show learners around today's project using your computer and projector. Remind them that the Web is a tool for personal, creative, and even musical expression. Point out that each track on the webpage has music embedded from Soundcloud, an on-line community for sharing music. Also note that above each Soundcloud player, there's a link to an online music-making tool, like Online Sequencer or Soundation

  Explain that in this project learners will

  1. Make 2-3 songs using Online Sequencer, Soundation, or both.
  2. Export those songs and save them locally as .mp3 or .wav files, which are sound files that can be uploaded to Soundcloud and played on the Web.
  3. Upload their songs to a class Soundcloud account or to individual accounts.
  4. Pick a license for your creative work.
  5. Remix the webpage from today's project to swap out the old music for their own songs from Soundcloud.
  6. Optionally, make up a band name and compose a mixtape cover to include in their remixed webpages through Thimble's selfie feature.

  Invite learners to click on the "remix" button on the Welcome to My Mixtape webpage so they can see the code for the project and access its tutorial. Ask learners to login using their Thimble accounts by clicking on "Log in" at the very upper right-hand corner of the screen. learners can access the tutorial by clicking on the "Tutorial" tab on the right-hand side of the screen.

  Take a moment to remind learners of community norms about using shared accounts if you're using a class Thimble account now and/or a class Soundcloud account later.

  Read through the tutorial with learners and answer any questions they have about it. Help learners who experience difficulty reading from screens to navigate the tutorial and complete each step. The tutorial will help learners to use Online Sequencer and Soundation, as well.

  Give learners another 30 minutes or so to compose 2-3 brief songs of no more than 30 seconds each using Online Sequencer and/or Soundation. Tell learners they can return to their music and produce more music outside of today's activity.

• 4. Uploading to Soundcloud

  15 minutes

  Ask learners to open Soundcloud in a new tab or window on thier computers. Ask them to login using a class account or individual accounts if they are so permitted.

  Walk learners through the upload process - which is also described in the tutorial - and give them 5-10 minutes to get their songs titled and uploaded. Remind learners to use appropriate titles and to keep from giving away too much personal information online. For example, songs don't need to have learners' names in their titles so long as learners can remember which songs are theirs.

  Finally, once all of the songs have been uploaded and processed (which may take a few minutes), show learners how to use "Share" and "Embed" to get the codes they need to remix their Welcome to My Mixtape webpages on Thimble.

• 5. Sharing and Embedding Music

  15 minutes

  Bring learners back to their Thimble projects and, referencing the tutorial, help them swap out the old music embeds with their new music embed codes from Soundcloud. Encouage learners to test their remixed webpages to make sure their songs play. Once learners have embedded their own music, invite them to hit the "Publish" button in the upper right-hand corner of their Thimble screens and then invite learners to share URLs or cycle around the room so they can listen to one another's music.

• 6. Optional: Creating Mixtape Covers

  15 minutes

  If you have time, draw learners' attention to the optional step in today's tutorial. Invite learners to come up with creative band names that are appropriate for your community and that don't give away too much personal information about learners. learners can also come up with similarly constrained titles for their mixtapes and draw or otherwise compose mixtape covers for their webpages with paper and markers or online tools.

  If learners compose mixtape covers on their computers, they can drag their files from wherever they live (like, in a folder on the hard drive) into the right side-bar on Thimble where it says "index.html" and "style.css." learners can then follow steps in the tutorial to add that image to their webpage mixtapes.

  If learners compose mixtape covers using analog media like paper and markers, they can follow the tutorial to use Thimble's "selfie" feature to take pictures of their mixtape covers and to embed those pictures in their webpage mixtapes.

• 7. Reflection and Assessment

  15 minutes

  Facilitate a reflective discussion of learners' experiences with creative, musical expression on the Web.

  Before you begin, remind learners of community norms about kindness and encourage them to talk about their own learning, not about other people.

  Use questions like these or develop your own.

  • What worked for you or seemed like fun in today's learning?
  • What didn't work or seemed difficult?
  • How was learning from the Web similar to or different from other ways you learn?
  • How was making your own music different from listening to someone else's music?
  • Before class today, did any of you ever use any of the websites we visited? What did you think of them? Did your opinion change today for any reason?
  • Do you think you would go back and make and share more music using any of today's tools? Why or why not?
  • What makes the Web "good" for making and sharing creative works like music?
  • Which license did you choose for your work? Why?
  • What makes creating and sharing creative work difficult on the Web?
  • What were the easiest and hardest parts of adding a mixtape cover today?
  • Which do you like more - old school mixtapes or new school mixtapes? Why?
  • If you wanted to take this project further, what could you search for on the Web on your own after today's project?
  • If you wanted to take this project further, what could you try to learn on the Web on your own after today's project?

  You may ask learners to document or record their answers for assessment. Be sure to help each learner find a way to share that works for her, as well as for you, so you can gauge her learning about today's topic without a particular tool (like paper/pencil) blocking a learner's expression.

  If you or your learners are curious to learn more, check out this Introduction to HTML or this module on embedding media on a webpage from the Mozilla Developer Network Learning Area.

  Next activity→Pixel Portrait
  
  
  

• 8. Optional: Badging

  By using Web-native music production tools, you will learn how to code, contribute, compose, remix, use open practice, share and synthesize.

  Steps to complete this task:

  1. Go to this Thimble project and click the "Remix" button. This will open Thimble, a tool that makes it easy to create and publish your own web pages while learning HTML, CSS & JavaScript. You will see survey questions we have created to get you started.
  2. Click on “Tutorial”.
  3. Follow the steps in the tutorial. The tutorial will walk you through how to make changes to the code.
  4. Once you are finished, you can save your work and share it. Log into your Webmaker account and hit "Publish."

  Evidence:

  Share a link to your new mixtape or upload a screenshot of your creation!

  21st Century Skills:

  If you successfully complete the above, you will practice the following skills:

  • Creativity

  The skills that you have learned through this activity can be recognized and validated by earning credentials or badges.

  Through a partnership with the Open Badges Academy (OBA), you can earn over 15 Web Literacy and 21st Century Skills credentials or badges. Once you earn them, you can share the credentials/badges via your social media or resume or use them to connect with others.

  If you are interested in applying for badges, visit the OBA and/or reach out to Matt Rogers or DigitalMe to schedule a demonstration.