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    

BREAK  

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

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

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

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

Your task

•  Purpose: Learn the technology •  Create two Conversations

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

LUNCH  

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

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

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

clear@msu.edu

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

Mashups: Steps continued

•  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

Mashups: Steps continued

•  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

clear@msu.edu

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”

BREAK

Individual  work  and  consulta/on  

See  you  tomorrow