rich%internetapplicaons%for%% language%learning ... · embed code • allows you to point back to a...

Rich Internet Applica/ons for Language Learning:

Introductory Techniques Angelika Kraemer Sco? Sterling

CLEAR Summer Workshop 2014

The Workshop

•  Overall goal: Skills and knowledge • Workshop, not a class •  Prac/cal, hands-‐on • Work toward your own goals •  Focus on technology skills, brainstorm how to apply it to teaching

•  Share with and learn from each other

Chime in at any /me

You will probably learn more from each other than from us

Workshop Overview

Day 1 •  Technology in the classroom •  Produc/on mode Day 2 •  Presenta/onal mode •  Student projects Day 3 •  Process mode •  Assessment

Day 1: Outline

•  Introduc/ons •  Rich Internet Applica/ons •  Technology in the language classroom •  Lunch •  Produc/on mode:

– Audio Dropbox – Video Dropbox –  Conversa/ons

CLEAR

•  Language Resource Center •  One of 15 na/onwide •  Funded by the US Department of Educa/on • Mandate: Strengthen FL teaching and learning in the US –  Research – Materials development –  Professional development – Outreach

•  Our stuff is free

The Lab

•  CeLTA Labs • Wi-‐Fi – feel free to use your own notebook

–  “MSUnet Guest”

•  Open 8:30 am – 7:30 pm •  “No food or drink in lab” •  Security of personal items

Leader: Angelika Kraemer

•  Director, CeLTALanguage School •  Execu/ve Associate Director, CeLTA • Workshop Presenter, CLEAR •  Background: Language teaching, online and blended learning and teaching

•  Primary language: German

Assistant: Sco? Sterling

•  PhD student in Second Language Studies •  Graduate Assistant, CLEAR/CeLTA •  Background: Linguis/cs, ESL, humor in the classroom

•  Primary language: Spanish

Now it’s your turn

Who are you?

Who are you?

•  Your name • Where you’re from • What language(s) you teach • What you hope to learn here

If you had to use one word to describe the role of technology in the

language classroom, what word would you choose?

Some possibili/es

•  Resource •  Partner •  Plaeorm •  Environment •  S/mulus •  Toy • Magic carpet

My favorite: “tool”

Rich Internet Applica/ons are tools to support language

teaching and learning

A taste

Try the RIAs now!

Please do the ac/vity on this web page:

h?p://clear.msu.edu/mashups/25845

Teacher can access student recordings

Brainstorm: How could you make use of this func/onality in your classroom?

You have burning ques/ons

Let me cover some basics, first

About the RIAs • Web-‐based (cloud compu/ng), Web 2.0 • Web pages with mul/media interac/vity embedded into them

•  Online programs for recording, uploading, mixing, and interac/ng

•  Can be created with no programming skills •  Can be used in and outside the classroom •  Available free of charge •  Stored on CLEAR’s server

System requirements •  Broadband connec/on • Web browser • Microphone and speakers (camera op/onal) •  Flash plugin , HTML5 to come soon •  Cross-‐plaeorm: Windows, Apple •  Cross-‐browser: Firefox, Safari, Chrome

Any other ques/ons?

You’re probably itching to try this yourselves

But first

Some more basics about technology in and outside the classroom

Technology in the language classroom

Your experience •  How have you used technology for your teaching or to communicate with students? – What has worked for you? – What has not worked for you?

Why technology?

•  Tradi/onal classrooms struggle ojen with –  Limited opportuni/es for students to use the target language

–  Limited access to authen/c materials –  Limited input from a variety of sources –  Integra/on of language, literature, and culture

•  Globaliza/on –  To produce compe//ve graduates, students need language and technology skills

Benefits of using technology •  Bring the target community into the classroom

•  Show/use authen2c materials

•  Interac2ve and student-‐centered

•  Instant feedback •  More democra/c par2cipa2on

•  Extension of class /me •  Increasing communica2on in the TL

•  Mul/media addresses mul/ple learner types

•  Mul/media format also allows for the prac/cing of all necessary language skills

•  Local and remote collabora2ons possible

•  Using genera/on Web 2.0’s language

•  Everyone needs to know how to use technology in order to be compe22ve on the job market

Challenges of technology •  Good products are hard to find and even harder to develop

•  Not everyone knows how to use the internet safely and responsibly

•  Not everyone can afford the technology or has access to it

•  Not everyone is computer literate

•  Keeping products and sojware up to date is expensive and /me consuming

•  Use of technology in the classroom requires con/nuously trained staff and support personnel

•  Equipment can fail

Why RIAs? •  Overcome some inherent weaknesses of the classroom language learning format

•  Enhance learning and prac/ce in the classroom – What gets prac/ced is what gets learned

•  Extend learning and prac/ce beyond the classroom –  If we want our students to be able to do something, we need to give them opportuni/es to prac/ce it

Unique functions of RIAs

• Web-‐based audio recording and playback

•  Process wri/ng with feedback

•  En/rely web-‐based •  Free

RIAs overview •  Audio Dropbox – student deposit for audio files (S) •  Broadcasts – podcasting (S,L) •  Conversations – simulated conversation (S,L) •  Mashups – combo of data/media resources (S,L,R,W) •  QuizBreak! – Jeopardy (S,L,R) •  Revisions – process writing (S,L,R,W) •  Scribbles – handwriting practice (R,W) •  SMILE – text-based exercises (R,W) •  Snapshot – photo library (supports S,W) •  Video Dropbox – student deposit for video files (S) •  Viewpoint – online recording studio and repository (S,L,R,W) •  Worksheets – interactive voice-based exercises (S,L,R)

RIAs are tools, not content

Applicable to any language, level, text, pedagogy

Now, let’s get started

You need to get an account: h?p://ria.clear.msu.edu

If you already have one, join CLEAR on Facebook:

h?ps://www.facebook.com/CLEARatMSU

Using RIAs Task% Tool%Collect'students’'recordings' Audio'Dropbox'(put'into'a'Mashup,'

your'own'web'page,'or'your'institution’s'course'management'system)''

Students'respond'orally'to'an'audio?video'cue''

Conversations''

Demonstrate'writing' Scribbles''

Create'an'audio'or'video'recording'for'your'students'

Viewpoint'''

Combine'media'and'text'onto'a'web'page'

Mashups'''

Production mode

•  Audio Dropbox •  Video Dropbox •  Conversations

Audio Dropbox (S)

•  Online mail box for audio files •  Can be placed in any web page, blog, wiki,

or in a LMS like Moodle, Blackboard etc. •  Students just click and record •  The system saves and uploads their

recordings automatically •  You can listen to recordings online, or

download them in MP3 format for mobile listening or archival purposes

You’ve already seen a Dropbox

Let’s do another activity

http://clear.msu.edu/mashups/25847

Your task

•  Purpose: Learn the technology •  Create various Audio Dropboxes

– For different class levels – For different languages – For individual students

Audio Dropbox: Steps

•  Create a “New Folder” •  Edit the folder (pencil icon)

– Rename the folder and save •  “Create a New Dropbox” •  Edit your dropbox (pencil icon)

– Rename the dropbox – Change the time limit (in seconds) – Place it in a folder – Save

Start-up guides

•  All RIAs have help documentation on the website – Overview flier for each application – FAQs for each application – FAQs for general troubleshooting – Step-by-step PDF documentation – Quick start-up guides for teachers and

students – YouTube links to tutorial videos

Your task

•  Create various Audio Dropboxes – For different class levels – For different languages – For individual students

Activity ideas

•  Prompted response exercises – Common assessment method where you

present students with a picture/video and ask them questions about it

•  Survey – Easy way to assess students’ levels early on

Video Dropbox (S)

•  Online mail box for video files •  Can be placed in any web page, blog, wiki,

or in a LMS like Moodle, Blackboard etc. •  Students just click and record •  The system saves and uploads their

recordings automatically •  You can view/listen to recordings online,

or download them in MP4 format for mobile viewing or archival purposes

This is what it looks like


Your task

•  Purpose: Learn the technology •  Create a Video Dropbox

Video Dropbox: Steps

•  “Create a New Dropbox” (currently no folder option)

•  Edit your dropbox (pencil icon) – Rename the dropbox – Change the time limit (in seconds) – Save

Your task

•  Purpose: Learn the technology •  Create a Video Dropbox

Conversations (S,L)

•  Simulated conversations and virtual interviews

•  Teachers record questions, students access the Conversation later to listen and respond to the questions

•  Audio and video •  Practice mode and real-time mode

Start-up guides

•  Using the start-up guides, please access the following Conversation as a student

•  Then create your own Conversation as a teacher

•  We will go through the process step-by-step afterwards

This is what it looks like


Your task

•  Purpose: Learn the technology •  Create two Conversations

– Simulate a real conversation (Q&A) – Listen and repeat

Conversations: Steps

•  Create a Conversation •  Set the number of questions •  Record your questions

– Adjust time limit •  Allow to practice if desired •  Listening to student recordings: Click on

the eye icon •  Share student recordings with colleagues:

Click on share icon

Your task

•  Purpose: Learn the technology •  Create two Conversations

– Simulate a real conversation (Q&A) – Listen and repeat

Activity ideas

•  Create a virtual conversation, interview, or role play – Prompts can encourage students to use the

target language in a “real” situation – Prompts can focus on content from class

readings, discussions, textbooks – Prompts can ask students to repeat after you

to focus on intonation and pronunciation

Presentational mode

•  Mashups – Linking Audio/Video Dropbox, Conversations

with text etc.

Mashups (S,L,R,W)

•  Combination of data or media resources from multiple websites onto a single web page

•  You can put a video from YouTube into a Mashup and add your own text, Dropbox/Conversation, and pictures

•  Mashups is a way of making pedagogical use of the rich media resources available on the Internet

You’ve already seen a Mashup

Now complete this activity


Your task

•  Purpose: Learn the technology •  Create a Mashup •  Add a text area •  Format text •  Include a Dropbox and Conversation •  Save, position, view your Mashup •  “Share” your Mashup with

[email protected]

Mashups: Steps

•  Create a “New Folder” •  Edit the folder (pencil icon)

– Rename the folder and save •  Create a “New Mashup” •  Edit your Mashup (pencil icon)

– Rename your Mashup – Place it in a folder via drop-down menu –  Include an Audio Dropbox via drop-down menu – Save

Mashups: Steps continued

•  “Add a text area” to include text – Delete “New Content” and type your text,

adjust font type, size, color etc. – Save

•  “Add an embeddable element” such as your Conversations or Viewpoint by using the embed code given – Reminder: for Audio Dropbox, simply select

the dropbox from the drop-down menu

Embed code

•  Allows you to point back to a site that hosts video (such as YouTube, Viewpoint, or Conversations)

•  For RIAs: – Click on the “HTML” icon of the RIA (e.g.,

Conversation) – Copy the code

•  For YouTube: – Below the video, click on “Share” and “Embed” – Copy the code


•  Paste the embed code in the “Add an embeddable element” section – Delete “New Content” and paste the embed

code – Change “item label” to describe what you are

pasting so you can differentiate – Save

Modify embed code for videos

•  You can have only parts of a video playing by changing the embed code – Link for CLEAR RIA video:

http://youtu.be/ObA3K3b9LS0 – Embed code for CLEAR RIA video:

<iframe width="420" height="315" src="//www.youtube.com/embed/ObA3K3b9LS0?rel=0" frameborder="0" allowfullscreen></iframe>

– Note where the link ends: /ObA3K3b9LS0

Modify embed code for videos continued

– Add the following at the end of the URL: ?start=(in seconds)&end=(in seconds)”

– The modified embed code will look like this: <iframe width="420" height="315" src="//www.youtube.com/embed/ObA3K3b9LS0?start=5&end=25”?rel=0" frameborder="0" allowfullscreen></iframe>

–  It will play the video only from second 5 to second 25


•  Move all media types into their desired positions by clicking on “position your elements on the screen” (second icon)

•  New window will open, close when done •  View the mashup (eye icon) to obtain URL

(new window will open) •  Share URL with students via course

management system, class website, email etc.

Your task

•  Purpose: Learn the technology •  Create a Mashup •  Add a text area •  Format text •  Include a Dropbox and Conversation •  Save, position, view your Mashup •  “Share” your Mashup with

[email protected]

Activity ideas

•  Combine different media types such as video, audio, images, text, and exercises in one place – Encourage students to be creative and use

technology – Make pedagogical use of the rich media

resources available on the Internet

Dropbox and Conversations

•  Listening to student recordings: – Click on the eye icon – Play back from within browser – Download as mp3 (audio) / mp4 (video)

•  Conversations: “Request Download”

Individual work and consulta/on

See you tomorrow

rich%internetapplicaons%for%% language%learning ... · embed code • allows you to point back to a...

Documents