Article

The kinetic typography engine: an extensible system for animating expressive text

Authors:

Scott E. HudsonAuthors Info & Claims

UIST '02: Proceedings of the 15th annual ACM symposium on User interface software and technology

Pages 81 - 90

https://doi.org/10.1145/571985.571997

Published: 27 October 2002 Publication History

Abstract

Kinetic typography --- text that uses movement or other temporal change --- has recently emerged as a new form of communication. As we hope to illustrate in this paper, kinetic typography can be seen as bringing some of the expressive power of film --- such as its ability to convey emotion, portray compelling characters, and visually direct attention --- to the strong communicative properties of text. Although kinetic typography offers substantial promise for expressive communications, it has not been widely exploited outside a few limited application areas (most notably in TV advertising). One of the reasons for this has been the lack of tools directly supporting it, and the accompanying difficulty in creating dynamic text. This paper presents a first step in remedying this situation --- an extensible and robust system for animating text in a wide variety of forms. By supporting an appropriate set of carefully factored abstractions, this engine provides a relatively small set of components that can be plugged together to create a wide range of different expressions. It provides new techniques for automating effects used in traditional cartoon animation, and provides specific support for typographic manipulations.

Supplementary Material

WMV File (kinetictypography_dsl.wmv)

Download
11.74 MB

Low Resolution (kinetictypography_56k.mov)

Download
3.08 MB

High Resolution (kinetictypography_dsl.mov)

Download
56.29 MB

References

[1]

{Bass59} Bass, S. (1959). Opening Credits to North by Northwest, Alfred Hitchcock, MGM, 1959. Available on the web at: http://www.twenty4.co.uk/online/issue001/project01/clips/nbynwest.rm

[2]

{Bass60} Bass, S. (1960). Opening Credits to Psycho, Alfred Hitchcock, Universal, 1960. Available on the web at: http://www.twenty4.co.uk/online/issue001/project01/clips/psycho.rm

[3]

{Bork83} Bork, A. (1983). "A Preliminary Taxonomy of Ways of Displaying Text on Screens." Information Design Journal, v3 n3, pp. 206-214.

[4]

{Brin01} Bringhurst, R. (2001) The Elements of Typographic Style ver 2.4. Hartely and Marks, Publishers. Point Roberts, WA. 2001.

[5]

{Chan93} Chang, B.-W., Ungar, D. (1993). "Animation: From Cartoons to the User Interface", UIST93 Conference Proceedings, pp.45-55.

Digital Library

[6]

{Chan98} Chang, B-W., Mackinlay, J., Zelleweger, P.T., and Igarashi, T. (1998). "A Negotiation Architecture for Fluid Documents." UIST98 Conference Proceedings, pp. 123-133.

Digital Library

[7]

{Cho99} Cho, Peter. (1999) "Pliant Type: Development and temporal manipulations of expressive, malleable typography". Masters thesis, Massachusetts Institute of Technology.

[8]

{Crys75} Crystal, D. (1975). The English Tone of Voice: Essays in intonation, prosody, and paralanguage. St. Martin's Press: New York.

[9]

{Duis86} Duisberg, Robert, (1986) "Animated Graphical Interfaces Using Temporal Constraints", CHI'86 Conference Proceedings, pp.131-136.

Digital Library

[10]

{Ford97} Ford, S., Forlizzi, J., and Ishizaki, S. (1997). "Kinetic Typography: Issues in time-based presentation of text." CHI97 Conference Extended Abstracts, pp. 269-270.

Digital Library

[11]

{Gren96} Greenberg, S., Gutwin, C., and Cockburn, A. (1996). "Awareness through fisheye views in relaxed WYSIWIS groupware. Graphics Interface 96 Conference Proceedings, pp. 28-38.

Digital Library

[12]

{Hieb92} Hiebert, K. (1992). Graphic Design Processes: Universal to Unique. Van Nostrand Reinhold: New York.

Digital Library

[13]

{Huds91} Hudson, Scott. (1991) "Incremental Attribute Evaluation: A Flexible Algorithm for Lazy Update", ACM Transactions on Programming Languages and Systems, v13, n3, pp. 315-341.

Digital Library

[14]

{Huds93} Hudson, S.E. and Stasko, J.T. (1993). "Animation Support in a User Interface Toolkit: Flexible, Robust, and Reusable Abstractions." UIST93 Conference Proceedings, pp. 57-67.

Digital Library

[15]

{Ishi96} Ishizaki, S. (1996). "Multiagent Design Systems: Visualization as an emergent behavior of active design agents." CHI96 Conference Proceedings, pp. 347-354.

Digital Library

[16]

{Ishi97} Ishizaki, S. (1997) "Kinetic Typography." Available on the web at: http://www.cmu.edu/cfa/design/kdg/kt/

[17]

{Ishi98} Ishizaki, S. (1998). "On Kinetic Typography", Statements, the Newsletter for the American Center for Design, v12 n1, pp. 7-9.

[18]

{Kand98} Kandogan, E. and Schneiderman, B. (1998). "Elastic Windows: A hierarchical multi-window World-Wide Web browser". UIST 98 Conference Proceedings, pp. 169-177.

Digital Library

[19]

{Lass87} Lasseter, J. (1987). "Principles of Traditional Animation Applied to 3D Computer Animation", SIGGRAPH'87 Conference Proceedings, pp. 35-44.

Digital Library

[20]

{Lewi99} Lewis, J.E. and Weyers, A. (1999). "ActiveText: a method for creating dynamic and interactive texts." UIST'99 Conference Proceedings, pp. 131-140.

Digital Library

[21]

{Masu95} Masui, T., Minakuchi, M., Borden IV G.R., and Kashiwagi, K. (1995). "Multiple View approach for smooth information retrieval." UIST'95 Conference Proceedings, pp. 199-206.

Digital Library

[22]

{Mill87} Mills, C. and Weldon, L. (1987). "Reading Text From Computer Screens." ACM Computing Surveys, v19 n4, pp. 329-358.

Digital Library

[23]

{Myer96} Myers, B. A., Miller, R.C., McDaniel, R., Ferrency, A. (1996). "Easily Adding Animations to Interfaces Using Constraints", UIST'96 Conference Proceedings, pp. 119-128.

Digital Library

[24]

{Neuw92} Neuwirth, C.M., Chandhok, R., Kaufer, D.S., Erion, P., Morris, J., and Miller, D. (1992). "Flexible diff-ing in a collaborative writing system." CSCW'92 Conference Proceedings, pp. 147-154.

Digital Library

[25]

{Pash98} Pashler, H., (1998). The psychology of attention. MIT Press: Boston, MA.

[26]

{Pott84} Potter, M. (1984). "Rapid Serial Visual Presentation (RSVP): A Method for Studying Language Processing." New Methods in Reading Comprehension Research. Mahwah, NJ: Lawrence Erlbaum, pp. 91-118.

[27]

{Rose98} Rosenberger, Tara. (1998) "Prosodic Font: The space between the spoken and the written". Masters thesis, Massachusetts Institute of Technology.

[28]

{Smal89} Small, D. (1989). "Expressive Typography". Master's Thesis, Media Arts and Sciences, Massachusetts Institute of Technology.

[29]

{Smit95} Smith, M. (1995). Engaging Characters --- Fiction, Emotion and The Cinema. : Oxford, England.

[30]

{Thom81} Thomas, F., Johnston, O. (1981). The Illusion of Life: Disney Animation. Hyperion Books : New York, NY:.

[31]

{Wong95} Wong, Y.Y. (1995). "Temporal Typography: Characterization of time-varying typographic forms." Master's Thesis, Media Arts and Sciences, Massachusetts Institute of Technology.

Cited By

Xie LShu XSu JWang YChen SQu H(2024)Creating Emordle: Animating Word Cloud for Emotion ExpressionIEEE Transactions on Visualization and Computer Graphics10.1109/TVCG.2023.328639230:8(5198-5211)Online publication date: 1-Aug-2024
https://dl.acm.org/doi/10.1109/TVCG.2023.3286392
Xie LZhou ZYu KWang YQu HChen S(2023)Wakey-Wakey: Animate Text by Mimicking Characters in a GIFProceedings of the 36th Annual ACM Symposium on User Interface Software and Technology10.1145/3586183.3606813(1-14)Online publication date: 29-Oct-2023
https://dl.acm.org/doi/10.1145/3586183.3606813
Kim JAhn SHong J(2023)Visible Nuances: A Caption System to Visualize Paralinguistic Speech Cues for Deaf and Hard-of-Hearing IndividualsProceedings of the 2023 CHI Conference on Human Factors in Computing Systems10.1145/3544548.3581130(1-15)Online publication date: 19-Apr-2023
https://dl.acm.org/doi/10.1145/3544548.3581130
Show More Cited By

Index Terms

The kinetic typography engine: an extensible system for animating expressive text
1. Applied computing
  1. Enterprise computing
  2. Operations research
    1. Marketing
2. Computing methodologies

Recommendations

TextAlive: Integrated Design Environment for Kinetic Typography
CHI '15: Proceedings of the 33rd Annual ACM Conference on Human Factors in Computing Systems

This paper presents TextAlive, a graphical tool that allows interactive editing of kinetic typography videos in which lyrics or transcripts are animated in synchrony with the corresponding music or speech. While existing systems have allowed the ...
Kinetic typography-based instant messaging
CHI EA '03: CHI '03 Extended Abstracts on Human Factors in Computing Systems

Kinetic Typography, text whose appearance changes over time, is emerging as a new form of expression due to its ability to add emotional content to text. We explored the potential for kinetic typography to improve the way people communicate over the ...
A user interface framework for kinetic typography-enabled messaging applications
CHI EA '04: CHI '04 Extended Abstracts on Human Factors in Computing Systems

Kinetic typography has recently emerged as a technology to enhance text with speech-like expressiveness. In this paper we describe a framework for an effective user interface of a kinetic typography-enabled messaging application. It supports the user ...

Comments

Information & Contributors

Information

Published In

cover image ACM Conferences

UIST '02: Proceedings of the 15th annual ACM symposium on User interface software and technology

October 2002

247 pages

ISBN:1581134886

DOI:10.1145/571985

Conference Chair:
Michel Beaudouin-Lafon
Université Paris-Sud

Copyright © 2002 ACM.

Permission to make digital or hard copies of all or part of this work for personal or classroom use is granted without fee provided that copies are not made or distributed for profit or commercial advantage and that copies bear this notice and the full citation on the first page. Copyrights for components of this work owned by others than ACM must be honored. Abstracting with credit is permitted. To copy otherwise, or republish, to post on servers or to redistribute to lists, requires prior specific permission and/or a fee. Request permissions from [email protected]

Sponsors

SIGCHI: ACM Special Interest Group on Computer-Human Interaction

Publisher

Association for Computing Machinery

New York, NY, United States

Publication History

Published: 27 October 2002

Permissions

Request permissions for this article.

Request Permissions

Check for updates

Author Tags

Qualifiers

Article

Conference

UIST02

Sponsor:

SIGCHI

UIST02: Symposium on User Interface Software and Technology

October 27 - 30, 2002

Paris, France

Acceptance Rates

Overall Acceptance Rate 842 of 3,967 submissions, 21%

Upcoming Conference

UIST '24

Sponsor:
sigchi
sigchi

The 37th Annual ACM Symposium on User Interface Software and Technology

October 13 - 16, 2024

Pittsburgh , PA , USA

Contributors

Other Metrics

View Article Metrics

Bibliometrics & Citations

Bibliometrics

Article Metrics

47
Total Citations
View Citations
2,424
Total Downloads

Downloads (Last 12 months)56
Downloads (Last 6 weeks)2

Reflects downloads up to 30 Aug 2024

Other Metrics

View Author Metrics

Citations

Cited By

Xie LShu XSu JWang YChen SQu H(2024)Creating Emordle: Animating Word Cloud for Emotion ExpressionIEEE Transactions on Visualization and Computer Graphics10.1109/TVCG.2023.328639230:8(5198-5211)Online publication date: 1-Aug-2024
https://dl.acm.org/doi/10.1109/TVCG.2023.3286392
Xie LZhou ZYu KWang YQu HChen S(2023)Wakey-Wakey: Animate Text by Mimicking Characters in a GIFProceedings of the 36th Annual ACM Symposium on User Interface Software and Technology10.1145/3586183.3606813(1-14)Online publication date: 29-Oct-2023
https://dl.acm.org/doi/10.1145/3586183.3606813
Kim JAhn SHong J(2023)Visible Nuances: A Caption System to Visualize Paralinguistic Speech Cues for Deaf and Hard-of-Hearing IndividualsProceedings of the 2023 CHI Conference on Human Factors in Computing Systems10.1145/3544548.3581130(1-15)Online publication date: 19-Apr-2023
https://dl.acm.org/doi/10.1145/3544548.3581130
YILDIZ MKEŞ Y(2022)Etkileşimli Ekran Uygulamalarında Kavramsal Tipografi TasarımlarıArt-e Sanat Dergisi10.21602/sduarte.120965815:30(1352-1376)Online publication date: 31-Dec-2022
https://doi.org/10.21602/sduarte.1209658
Lan XShi YWu YJiao XCao N(2022)Kineticharts: Augmenting Affective Expressiveness of Charts in Data Stories with Animation DesignIEEE Transactions on Visualization and Computer Graphics10.1109/TVCG.2021.311477528:1(933-943)Online publication date: Jan-2022
https://doi.org/10.1109/TVCG.2021.3114775
Kim CSon ONam T(2019)The Effect of Handwriting and Physical Representation in Computer-Mediated Text CommunicationArchives of Design Research10.15187/adr.2019.05.32.2.4532:2(45-55)Online publication date: 31-May-2019
https://doi.org/10.15187/adr.2019.05.32.2.45
Bragg DAzenkot SLarson KBessemans AKalai AGajos KMankoff JHarrison C(2017)Designing and Evaluating LivefontsProceedings of the 30th Annual ACM Symposium on User Interface Software and Technology10.1145/3126594.3126660(481-492)Online publication date: 20-Oct-2017
https://dl.acm.org/doi/10.1145/3126594.3126660
Yoo SLakshminarayana CBasu AInakage MIshii HDo ESteimle JShaer OKunze KPeiris R(2017)Nellodee 1.0Proceedings of the Eleventh International Conference on Tangible, Embedded, and Embodied Interaction10.1145/3024969.3025086(517-520)Online publication date: 20-Mar-2017
https://dl.acm.org/doi/10.1145/3024969.3025086
Wang FNagano HKashino KIgarashi T(2017)Visualizing Video Sounds With Sound Word Animation to Enrich User ExperienceIEEE Transactions on Multimedia10.1109/TMM.2016.261364119:2(418-429)Online publication date: 1-Feb-2017
https://dl.acm.org/doi/10.1109/TMM.2016.2613641
Pahud M(2017)Insights from Exploration of Engaging Technologies to Teach Reading and Writing: Story BakerFrontiers in Pen and Touch10.1007/978-3-319-64239-0_12(167-186)Online publication date: 2-Dec-2017
https://doi.org/10.1007/978-3-319-64239-0_12
Show More Cited By

View Options

Get Access

Login options

Check if you have access through your login credentials or your institution to get full access on this article.

Full Access

Get this Publication

View options

PDF

View or Download as a PDF file.

eReader

View online with eReader.

Media

Figures

Other

Tables

View Table of Contents