PRESENTED BY: AMY SHANNON Animation: From Cartoons to the User Interface Bay-Wei Chang and David Ungar. 1993. Animation: from cartoons to the user interface.

Slides:



Advertisements
Similar presentations
Comparing Fractions and Decimals Grade 5
Advertisements

Film Editing. Learning Objective… To identify how specific approaches to editing are applied in film.
Computer Supported Cooperative Work by an Agent Oriented Software Engineering Approach: CSCW by AOSE Darlinton Carvalho
Internet Basics. Objectives What is the Internet? What is the Web? How does the Internet work? What do I need to surf the Net? What will I find on the.
Developing a Strong Network 2012 Professional Development Series
Using Technology in Healthcare Program Development Anthony Gamboa Harry S Truman College.
Learning log 11/1 1. Go to 2. Find Video Achieve near the bottom of the page. 3. Click on.
Social Media and the University of Bath. 10 th September 2010.
Getting Started with Social media YouTube, We Tube Jayme Swain Director, Engage.
Learning Log 11/16, Part 1 Copy each sentence about the US Constitution and fill in the blank 1.Amendment __ gave women the right to vote. 2.Amendment.
wlhUcSGqgshttp:// wlhUcSGqgs.
K. Stoeckigt, Secure real-time audio/video communication – H.350, Encryption & Gatekeeper/Proxy – using H.323 (…and a bit SIP) Tutorial/Workshop.
The E- Essentials of E-Content Development and E- Learning INTRODUCTION TO E-LEARNING Instructional Design Constructivism e-learning and LMS FOSS Tools.
SMSGYAN GYAN EVENTS Promote your event to mobile users.
© Aastra – 2010 Aastra XML 4 SIP Contest Applications Short presentation of every application.
An Intelligent System for Dynamic Online TV Programming Allocation from TV Internet Broadcasting Thamar E. Mora, Rene V. Mayorga Faculty of Engineering,
Educating into the future Showcase of teaching practices Mobile devices for student interaction in class Didy Button School of Nursing & Midwifery 26 July.
Fraunhofer Institute FOKUS
Multimedia Authoring1 Animation What is Animation Animation is defined as the act of making something come alive. It is concerned with the visual or aesthetic.
Data Mining and Text Analytics Advertising Laura Quinn.
Do Now: 1) Write down your observations of each side of the cartoon. 2) What is this political cartoonist trying to say? 2m.
Introduction.
Space Missions Can Your Library Automation Software Do This? David Hook MDA
TANGIBLE INTERFACES: inFORM Elizabeth Chlipala. “As humans, we have evolved to interact physically with our environments, but in the 21st century, we're.
©2011 1www.id-book.com Introducing Evaluation Chapter 12.
Video Production Tutorial Learn how to shoot, edit and export videos from second life.
 LaToya Kelley, Director of Instruction Simon Technology New Teacher Circle Workshops.
Multi-Platform Assigning Lisa Murphy for CSME twitter.com/lisamurphyTO
User-Centered Design: From Concept to Product Peter Merholz peterme
Making your website ‘user-centric’ Danielle Roddick Web Services Unit.
Natural User Interface (NUI)
DISPLAY TECHNOLOGY COMPUTER INTERACTION Organic User Interfaces.
Presenters : Dr. Chephra McKee, Pharm.D. Dwaine Fombuh, Pharm.D. Candidate, Class of 2015 Running An Effective Meeting.
Communicative Oral Language in the Classroom PEER Center Training Surin April 30-May 2, 2014.
An Introduction to D3.js By Robert Dillon.
PATTERNS OF COMMUNICATION Part 2: In a Blended Classroom.
Tyler Evans Wednesday May 8 th, Timing and Music  Generally minutes is good target  Timing can be anywhere from 3 – 7 seconds per slide/picture.
A web application for browsing research papers By: Rhea Dookeran 09’
Skills: familiarity with the Twitter user interface and major features, using the hashtag (#) and at-sign searching and tweeting images and videos.
SideBySide: Ad-Hoc Multi-User Interaction with Handheld Projectors Karl D.D. Willis, Ivan Poupyrev, Scott E. Hudson, and Moshe Mahler SideBySide:
Prestbury Publishing Consultancy Brian Carvell. Scope of presentation Textbook production Delivery mechanisms New technologies in the teaching and learning.
Evaluation in Digital Media Graphics Basic Concepts.
1 SIMS 247: Information Visualization and Presentation Marti Hearst Animation.
Animation IS 247: Information Visualization and Presentation Saifon Obromsook Linda Harjono.
Animation in the Interface. Reading assignment: This section based on 4 papers Principles of traditional animation (derived from Disney and translated.
The rapid display of a sequence of images or model positions in order to create an illusion of movement. ANIMATION.
ITIS 1210 Introduction to Web-Based Information Systems Chapter 41 How Animation on the Web Works.
2013 TAC Workshop - Industry Social Technology Presented by Ben Tutt.
Introduction to Alice Alice is named in honor of Lewis Carroll’s Alice in Wonderland.
Adobe FLASH What & Why? Where & When? Is Flash dead? What about HTML5?
MULTIMEDIA DEFINITION OF MULTIMEDIA
Class 02 – 03 Feb 2014 Setup Where do we begin? Know your content Discovering your target user.
WHAT’S IN THE NEWS? Thought for the Week W/C 29 th June 2015.
Spring /6.831 User Interface Design and Implementation1 Lecture 24: Animation HW2 out, due next Sunday look for your evaluation assignment on.
Module Code: CU1025NI 3D Modelling and Animation Basics Week – 2 - Extra.
More Than The Sum Of Its Parts outcomes of effective collaborations beyond libraries #laf2014
The Cartoon Laws of Physics:
, Spring 2004CS4455 Applying Traditional Animation.
Physics 11 Mr. Jean March 21 st, The plan: Video clip of the day Mass & Weight Solutions Force Diagrams.
Animation in the Interface. 2 Reading assignment: This section based on 2 papers n Bay-Wei Chang, David Ungar, “Animation: From Cartoons to the User Interface”,
Animation By: Sanjna Iyengar. Slow in and Slow out and Arcs -The ball bounces slowly at first and then increases its speed. It travels up and down, with.
What is Alice? Alice is an innovative 3D programming environment that makes it easy to create an animation for telling story, playing an interactive game,
Fall UI Design and Implementation1 Lecture 13: Animation.
Express your kindness!. Alisa Yamanaka Danny Kitt Haochen Wei Jared Jones Yuna Shim Team Members.
WHAT IS YOUR PERCEPTION ABOUT ANIMATION?
Studios and there creations
العدد تذكيره وتأنيثه مقدمة
Topic 14: Jacob O. Wobbrock, Andrew D. Wilson, and Yang Li. 2007
12 Principles of Animation
Presentation transcript:

PRESENTED BY: AMY SHANNON Animation: From Cartoons to the User Interface Bay-Wei Chang and David Ungar Animation: from cartoons to the user interface. In Proceedings of the 6th annual ACM symposium on User interface software and technology (UIST '93). ACM, New York, NY, USA,

About the Authors Bay-Wei Chang has worked at Stanford, Palo Alto Research Center, and Google. His most recent publication (2005) related to query-free news searches. David Ungar has worked at UC Berkely, Stanford, Sun Microsystems, and IBM Research. His most recent publication (2014) related to context- oriented programming.

The Problem UI events are startling and confusing to users Difficulty connecting screen states Objects act in unrealistic ways

The Solution

Wile E. Coyote & Road Runner Movie Clip: ysics/Road_Runner_Physics/Movie.html ysics/Road_Runner_Physics/Movie.html (Introduction Video)

Solidity Motion Blur Arrivals & Departures Dissolves

Road Runner Self UI Motion Blur

Exaggeration Movie Clip: ysics/Road_Runner_Physics/Movie.html ysics/Road_Runner_Physics/Movie.html (Log Tunnel Video)

Exaggeration Anticipation  Lean back before they start running Follow Through  Vibrate after they stop running When objects move on their own in the UI, they follow these same principles

Reinforcement Movie Clip:

Reinforcement Slow In & Out Arcs Follow Through

Why Cartoons? Theatrical Engaging Similar medium Animators have achieved successes of “communication, vibrancy, and illusion”

Why Not Cartoons? Users don’t interact with cartoons UIs are for work, not play

Discussion Questions 1. Which of these animation techniques are still present in modern-day UIs? Which are not? Why were some of these techniques beneficial at that time but not now? 2. Are there modern animation techniques that could be applied to UIs? Or, are there animation techniques that were applied after this paper was written? 3. The authors justify their use of cartoon animation by saying cartoons are theatrical and engaging, and that these qualities are beneficial to a UI. Do you agree? When/how are current UIs "theatrical"?