Showing posts with label apps. Show all posts
Showing posts with label apps. Show all posts
'80s Flashback Music Quiz
Test your 80's pop/rock music trivia knowledge with Mark Goodman. Click the button to start the quiz. This version has Facebook sharing at the end of the quiz.
We shot this mindful of the experience of the Ziggy Marley shoot in July. Rather than asking open-ended text questions, this has a quiz format, where the user's primary interaction is to click buttons on screen (and occasionally to type) in response to trivia questions.
Back at Tad Low's, we shot with 2 cameras, lights and make-up. Mark Goodman was the consummate professional and the shoot was very smooth. Later, we went back and forth on whether to show a still shot or a video of Mark waiting while the user answers the question. We eventually went with the still.
The code for this application is here.
Drunken Tired Santa
Drunken Santa sounds off about life and his job. Help him by clicking the red buttons and the snowflake instructions. Note: some of his comments are off-color.
YouTube integration #1
YouTube integration demo #1. This pulls media from within YouTube using the YouTube chromeless player. InteractiveXML floats over the top.
Notes on this demo:
1.HOVER OVER THE VIDEO. Hover over certain areas for one second for an explanation of what you are hovering over. We could also have set it up to detect movement in a certain direction, or have the user trace out a certain pattern.
2. HOT ZONES. Click on the top right of the video to highlight the hover-able zones in red. Click again to remove the red highlighting.
3. EMAIL THE VIDEO at the address at the top. Put the name of the color in the first line of the BODY of the email (not, not, NOT the subject as I say in the video.) I will get the email in the video and talk about that color.
4. TALK TO THE VIDEO. Hover over my head and the microphone will be switched on. You'll have to "allow" Flash to use your microphone. When you see a green button, click it, wait until it turns red, speak a color name then click it again to stop recording. I should respond to what you have said. If I don't check your microphone! If you don't click the button to stop recording it will automatically cut off after 4 seconds and try to analyze the voice sample.
5. USAGE INFORMATION. Hover over my keyboard in the video for 1 second. The displayed info will go away by itself after a few seconds of video play.
5. YOU'VE HAD ENOUGH OF ME. Hover over the top left of the video for a second. I will go away.
The underlying code is here.
You Tube integration #2
Movie Date Trivia
Similar (structurally) to the Mark Goodman trivia game that we did last year, this one also includes Facebook integration. Twenty questions total, with five chosen at random for each round. The quiz "chassis" code is here and can be easily adapted for other trivia quizzes. We shot this at Tad Low's with Andrea Syrtash, who did great despite the noise of the UPS trucks and mosque calls-to-prayer outside. Scripting the questions requires a fine balance. Pat's script wove a fine line between being too serious, too comical, too hard and too easy. Lines and words had to be comparatively short and easy to read because we only had an hour to shoot over 120 lines and we held the script cards next to the camera (no autocue).
The code for this application is here.
Soundboard 2: Baby Taddy
In just ten minutes at the end of a shooting day we shot Tad's irreverent “Baby Taddy” puppet. Simple, quick (10 minutes) to get and fun. Mouse-overs and/or clicks make the media play and the script underneath inserts “ands” and “ares” to make the simple "Tadlibs."
The code for this application is here.
Soundboard 2b: Baby Taddy
A slight evolution (if you could call it that) of Baby Taddy with grunge music and new graphic elements. Still a way to go on this one.
Trivia Demo
A trivia game featuring U.S. geography questions (see '80s Flashback Music Quiz and Movie Date Trivia for creatively executed versions) and "generic" videos that are available to developers so that they can create their own interactive trivia game.
The video clips are here and the code is here.
This application is referred to on the Interactive XML documentation site.
Soundboard 1: George Bush
A simple "soundboard" designed so users can easily conceive, copy, adapt and deploy their own versions. This one only has about 20 voice clips.
Ken Perlstein came in to record the voiceover for some George Bush madlibs and we took a few words from the recording session and made a "soundboard" to demonstrate the mouse-over function.
Mouse over the squares - no need to click - pausing slightly, and George Bush will utter a word or phrase. Traveling through columns 1-2-3 or 3-2-1 will insert the word "are" to make a sentence. Try it! Words don't play instantly (they could) because responding to ANY mouse movement/tracking would trigger too many words.
This is in no way a political statement. George Bush is a recognizable public figure that we are using to demonstrate technology.
Central Park: Mouse-Over/Mouse Movement
We wanted to allow creatives to use mouse control functionality to direct video experiences and were impressed by Oliver Otten's work at http://www.selfcontrolfreak.com.
We had to strike a balance between building in enough functionality for it to be good and usable but not so much that the underlying .swf becomes bigger (slower to load) or the scripting code becomes too complex. This simple demo shows how mouse up, down, out and movement can be used to direct video.
The shoot was short, simple (again in Central Park) and functional, so you will see jump cuts (which could have been avoided by using two cameras) and sun/lighting changes (which would have been mitigated in a professional shoot).
INSTRUCTIONS
* Mouse anywhere over the frame to start. Wait until Matthew is in the center, then:
* Mouse out of frame to the left to walk left, pause, then mouse over frame to re-enter.
* Mouse out of frame to the right to jog right, pause, then mouse over frame to re-enter.
* Mouse out of frame to the bottom for push-ups. On the 4th or 5th push-up (only), mouse into frame, wait, and a small gray square will appear. Mouse over the gray square and a big bottle will appear. Drag the bottle and release in the hand to drink.
* Mouse out of frame to the top for jumping jacks. On the 4th jumping jack (only), mouse into frame, wait, and a small gray square will appear. Mouse over the gray square and a big bottle will appear. Drag the bottle and release in the hand to drink.
* Drag torso from center towards edge (up, down, left or right) and release to achieve same actions as mouse out of frame above.
* In all cases, video is ready for new command only when old video FINISHES.
Try it!
Coffee Talk 2: Speech Recognition Through the Browser
This application shows how an interactive video (e.g., a web ad) can interpret and branch based on user speech, using no plug-ins (just Flash).
Click the green phone button to start. If you have a microphone on your computer (and it is switched on), the video will respond to your voice (carefully watch the prompts at the bottom). This is new technology and a little fragile, so if it doesn't work, reach out to us and we'll make it work.
In a sense the voice interactions are "voice buttons" in as far as buttons could have been used, but instead we stream the user's voice for a short time to our server, transcode it, then evaluate it against a simple, limited voice grammar in a speech engine (we are using LumenVox for this application), then we send the result/determination back to the browser, all in real time. Compare it to the "telephone the browser" voice application also on this blog, which uses actual telephony. Both are voice apps but they feel quite different. Through-the-browser speech recognition is almost (but not quite) free, unlike telephone speech recognition which always involves a per-minute charge.
Adam Lambert 5 Questions
Built in a day to brainstorm with VH-1 from a few seconds of interview footage they had shot. Interactive footage requires a different kind of shoot where the celebrity asks questions and responds to the user - see the Jean Beauvoir interactive interview for a more fully developed interactive interview.
Ad Agency Demo for PHD
We did several demos in the first half of 2010 for the ad agency PHD, all shot down-and-dirty with a Flip camera and a table stand (no mic) in their office on 42nd Street. The shoots each took between 10 and 25 minutes. This one was the first and was designed to demonstrate how an ad unit could receive SMS texts and send emails. Put a camera in front of people and typically they starting "mugging" for it, which, unless they are trained, is a bad thing. Seth did a great job of not acting and being natural; the shoot was fast and good.
Jean Beauvoir Interactive Interview
We shot Jean right after Mark Goodman, and so saved time on the camera/lights set-up. This was an interactive interview where the talent (as opposed to the user) asks the questions and tells the user some stories (we had learned our lesson from Ziggy.) In one question in this application, Jean asks the user what their favorite color is. Then, to analyze the text response, we make a background HTTP call (rather than try to process in the ad unit itself).
Spin The Bottle House Party
Another "choose your own adventure." An interactive house party at Tad Low's place, hosted by Tad, with musical performances and various states of drunkenness. The user makes choices and navigates their way through Tad's party. We deployed a TV version of this on Verizon's FiOS service in February 2010.
Coffee Talk 1: Telephone/Video Synchronization
This example syncs voice recognition through the telephone with web video playback. We reached out to our friends at Voxeo to use their voice software and telephony/technology platform.
This was shot low-budget using a Flip HD camera and another low-budget camera. No lights. Shooting outdoors means constant sound, light and shadow variations, and, because of the lower-quality cameras, focus variations. (We did use tripods and one camera had a $30 mic.) Separately, we picked up the Central Park shots on the fly, just with the Flip.
We showed this example to many ad agencies to many wows. One issue was: the more people call, the more deployment would cost. Another related to talent. Talent wrangling is hard and schedules, rights, fees and creative approvals become complex.
Call the number on the screen and interact with the video playing out in the ad unit. The unit is small - 70K - and pulls the media it needs from source in real time. The speech recognition on this app is pretty simple, so follow the options as they appear on the screen.
Turn the volume down on your computer speakers, otherwise the application will hear any background noise that's in the room. Also, speakerphones are particularly tough, because they try and interpret everything they hear and cannot interpret sound the way the human ear can.
Try it!
Ziggy Marley Interactive Interview
Ziggy was the first interactive interview that we shot. He was extremely good-natured even though he could see we were still figuring some of this stuff out.
We shot Ziggy at Spin The Bottle, Tad Low's production company, with lights and 2 cameras in about 45 minutes. We envisaged (still envisage!) a celebrity interview of 30 minutes that gives the user a more enjoyable, personal interview experience than just watching an interview video from start to finish.
Our original script envisaged users typing text and Ziggy responding in video but (1) celebrities have limited time for interviews, (2) it is hard to predict and record enough responses to be able to give users quality answers, (3) users expect "Google"-type intelligence in response to text input which is very hard to do, and (4) some users type inappropriate/crazy questions. It is far better that the celebrity ask the user a "closed" question such as "Do you want to hear a track from my new album?" than an open question such as "What do you want to talk about?" Text input can still work (see the "What is your favorite color" question in the Jean Beauvoir application) but user expectations should be clearly set. This is not AI; these are interactive video experiences.
Back then we were using Flash to play video but we were adding the other screen elements using HTML/Ajax and we were told that the design/layout of the screen looked old-fashioned.
What is shown here is not the original version, but a newer version using Interactive XML, which was not released as a technology until 6 months later.
Choose A Different Ending
"Choose A Different Ending," produced by AMV BBDO in the UK and deployed for the Metropolitan Police in London in 2009, was a "Choose Your Own Adventure" (CYOA)-type experience where one video links to another. It was a great implementation of YouTube's Annotations product. Annotations only work within YouTube, and Interactive XML adds a lot more power to them with features such as "memory" within an interactive session and between sessions, looping, calculations, variables, http linkage with other services, etc. It's like Annotations on steroids.