Web Literacy Basics II | 4. Welcome to My Mixtape
Made by Mozilla
2 hours
By using Web-native music production tools, you will learn how to code, contribute, compose, remix, use open practice, share and synthesize.
Activity 4 of 9
Write and Participate on the Web
21st Century Skills
Communication CreativityWeb Literacy Skills
Code Compose Contribute Remix Open Practice Share SynthesizeLearning Objectives
- Compose music using Web-native tools.
- Remix and customize a webpage with embedded audio media.
- Participate in a music-sharing Web community.
- Choose a license for creative works.
- Reflect on opportunities for creative expression in community on the Web.
Audience
- 13+
- Beginner web users
Materials
- Internet-connected student computers
- An Internet-connected instructor computer with a projector
- Markers
- Paper
Check out the ways educators and activists have modified this activity for their specific audiences in our Discussion Forum.
-
1. Preparation
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.
- Follow this link to the Thimble project for this activity.
- Click on the green "Remix" button in the upper right-hand corner of the window to go into the project's code.
- Click on the "Tutorial" pane next to the "Preview" pane in the upper right-hand corner of the coding window.
- 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 minutesWelcome your students 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 students' answers so everyone can see their ideas.
Next, ask learners where the word "mixtape" came from. Let students 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 students 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 students' 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 students how mixtapes looked in the past and how they look today. Ask students 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 minutesShow students 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 students will
- Make 2-3 songs using Online Sequencer, Soundation, or both.
- 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.
- Upload their songs to a class Soundcloud account or to individual accounts.
- Pick a license for your creative work.
- Remix the webpage from today's project to swap out the old music for their own songs from Soundcloud.
- Optionally, make up a band name and compose a mixtape cover to include in their remixed webpages through Thimble's selfie feature.
Invite students 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 students to login using their Thimble accounts by clicking on "Log in" at the very upper right-hand corner of the screen. Students can access the tutorial by clicking on the "Tutorial" tab on the right-hand side of the screen.
Take a moment to remind students 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 students and answer any questions they have about it. Help students who experience difficulty reading from screens to navigate the tutorial and complete each step. The tutorial will help students to use Online Sequencer and Soundation, as well.
Give students 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 students they can return to their music and produce more music outside of today's activity.
-
4. Uploading to Soundcloud
15 minutesAsk students 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 students 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 students to use appropriate titles and to keep from giving away too much personal information online. For example, songs don't need to have students' names in their titles so long as students can remember which songs are theirs.
Finally, once all of the songs have been uploaded and processed (which may take a few minutes), show students 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 minutesBring 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 students to test their remixed webpages to make sure their songs play. Once students 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 students to share URLs or cycle around the room so they can listen to one another's music.
-
6. Optional: Creating Mixtape Covers
15 minutesIf you have time, draw learners' attention to the optional step in today's tutorial. Invite students to come up with creative band names that are appropriate for your community and that don't give away too much personal information about students. Students 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 students 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." Students can then follow steps in the tutorial to add that image to their webpage mixtapes.
If students 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
15 minutesFacilitate a reflective discussion of students' experiences with creative, musical expression on the Web.
Before you begin, remind students 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 students to document or record their answers for assessment. Be sure to help each student 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 student'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 --> Pixel Portrait