Automatic Video Creation From a Web Page

Creating marketing videos from scratch can be challenging, especially when designing for multiple platforms with different viewing criteria. We present URL2Video, an automatic approach that converts a web page into a short video given temporal and visual constraints. URL2Video captures quality materials and design styles extracted from a web page, including fonts, colors, and layouts. Using constraint programming, URL2Video's design engine organizes the visual assets into a sequence of shots and renders to a video with user-specified aspect ratio and duration. Creators can review the video composition, modify constraints, and generate video variation through a user interface. We learned the design process from designers and compared our automatically generated results with their creation through interviews and an online survey. The evaluation shows that URL2Video effectively extracted design elements from a web page and supported designers by bootstrapping the video creation process.

[1]  Maurizio Marchese,et al.  Relationship Between Visual Complexity and Aesthetics of Webpages , 2020, CHI.

[2]  Maneesh Agrawala,et al.  Generating Audio-Visual Slideshows from Text Articles Using Word Concreteness , 2020, CHI.

[3]  Yang Li,et al.  Modeling Human Visual Search Performance on Realistic Webpages Using Analytical and Deep Learning Methods , 2020, CHI.

[4]  Dan B. Goldman,et al.  Text-based editing of talking-head video , 2019, ACM Trans. Graph..

[5]  Lydia B. Chilton,et al.  VisiBlends: A Flexible Workflow for Visual Blends , 2019, CHI.

[6]  Paul N. Bennett,et al.  Guidelines for Human-AI Interaction , 2019, CHI.

[7]  Clemens Nylandsted Klokmose,et al.  Vistribute: Distributing Interactive Visualizations in Dynamic Multi-Device Setups , 2019, CHI.

[8]  Jingtao Wang,et al.  AttentiveVideo: A Multimodal Approach to Quantify Emotional Responses to Mobile Advertisements , 2019, ACM Trans. Interact. Intell. Syst..

[9]  Gautham J. Mysore,et al.  B-Script: Transcript-based B-roll Video Editing with Recommendations , 2019, CHI.

[10]  Adam Finkelstein,et al.  A Mixed-Initiative Interface for Animating Static Pictures , 2018, UIST.

[11]  Thomas F. Liu,et al.  Learning Design Semantics for Mobile Apps , 2018, UIST.

[12]  Rynson W. H. Lau,et al.  Modeling Fonts in Context: Font Prediction on Web Designs , 2018, Comput. Graph. Forum.

[13]  Adriana Kovashka,et al.  Story Understanding in Video Advertisements , 2018, BMVC.

[14]  David Salesin,et al.  Extracting Regular FOV Shots from 360 Event Footage , 2018, CHI.

[15]  Hongbo Fu,et al.  Live Sketch: Video-driven Dynamic Deformation of Static Drawings , 2018, CHI.

[16]  Adam Finkelstein,et al.  Secondary Motion for Performed 2D Animation , 2017, UIST.

[17]  Jeffrey Nichols,et al.  Rico: A Mobile App Dataset for Building Data-Driven Design Applications , 2017, UIST.

[18]  Maneesh Agrawala,et al.  Computational video editing for dialogue-driven scenes , 2017, ACM Trans. Graph..

[19]  Mingda Zhang,et al.  Automatic Understanding of Image and Video Advertisements , 2017, 2017 IEEE Conference on Computer Vision and Pattern Recognition (CVPR).

[20]  Patrick Gros,et al.  Automatically Creating Adaptive Video Summaries Using Constraint Satisfaction Programming: Application to Sport Content , 2017, IEEE Transactions on Circuits and Systems for Video Technology.

[21]  Rynson W. H. Lau,et al.  Directing user attention via visual flow on web designs , 2016, ACM Trans. Graph..

[22]  Ranjitha Kumar,et al.  ERICA: Interaction Mining Mobile Apps , 2016, UIST.

[23]  Wilmot Li,et al.  QuickCut: An Interactive Tool for Editing Narrated Video , 2016, UIST.

[24]  Anind K. Dey,et al.  XDBrowser: User-Defined Cross-Device Web Page Designs , 2016, CHI.

[25]  Stephen DiVerdi,et al.  Palette-based photo recoloring , 2015, ACM Trans. Graph..

[26]  Aaron Hertzmann,et al.  Learning Layouts for Single-PageGraphic Designs , 2014, IEEE Transactions on Visualization and Computer Graphics.

[27]  Aaron Hertzmann,et al.  Exploratory font selection using crowdsourced attributes , 2014, ACM Trans. Graph..

[28]  Takeo Igarashi,et al.  Offline painted media for digital animation authoring , 2014, CHI.

[29]  Patrick Gros,et al.  Constraint Satisfaction Programming for Video Summarization , 2013, 2013 IEEE International Symposium on Multimedia.

[30]  Pei-Yu Chi,et al.  DemoCut: generating concise instructional videos for physical demonstrations , 2013, UIST.

[31]  David R. Karger,et al.  Cascading tree sheets and recombinant HTML: better encapsulation and retargeting of web content , 2013, WWW.

[32]  Ranjitha Kumar,et al.  Webzeitgeist: design mining the web , 2013, CHI.

[33]  Wilmot Li,et al.  Tools for placing cuts and transitions in interview video , 2012, ACM Trans. Graph..

[34]  Berthier A. Ribeiro-Neto,et al.  A site oriented method for segmenting web pages , 2011, SIGIR.

[35]  Ranjitha Kumar,et al.  Bricolage: example-based retargeting for web design , 2011, CHI.

[36]  Jun Xiao,et al.  iSlideShow: a content-aware slideshow system , 2010, IUI '10.

[37]  Andrew Chi-Sing Leung,et al.  Animating animal motion from still , 2008, SIGGRAPH Asia '08.

[38]  Deepayan Chakrabarti,et al.  A graph-theoretic approach to webpage segmentation , 2008, WWW.

[39]  David Salesin,et al.  Adaptive layout for dynamically aggregated documents , 2008, IUI '08.

[40]  Jun-Cheng Chen,et al.  Tiling slideshow , 2006, MM '06.

[41]  Dan B. Goldman,et al.  Schematic storyboarding for video visualization and editing , 2006, ACM Trans. Graph..

[42]  Joshua Goodman,et al.  Finding advertising keywords on web pages , 2006, WWW '06.

[43]  Chris Jermaine,et al.  Relational confidence bounds are easy with the bootstrap , 2005, SIGMOD '05.

[44]  Yuichi Ohta,et al.  Computational video editing model based on optimization with constraint-satisfaction , 2003, Fourth International Conference on Information, Communications and Signal Processing, 2003 and the Fourth Pacific Rim Conference on Multimedia. Proceedings of the 2003 Joint.

[45]  David Salesin,et al.  On creating animated presentations , 2003, SCA '03.

[46]  David Salesin,et al.  Adaptive grid-based document layout , 2003, ACM Trans. Graph..

[47]  Peter Brusilovsky,et al.  From adaptive hypermedia to the adaptive web , 2002, CACM.

[48]  Marti A. Hearst,et al.  Empirically validated web page design metrics , 2001, CHI.

[49]  Rynson W. H. Lau,et al.  Dynamic Manga: Animating Still Manga via Camera Movement , 2017, IEEE Transactions on Multimedia.

[50]  Zonghuan Wu,et al.  Videolization: knowledge graph based automated video generation from web content , 2016, Multimedia Tools and Applications.

[51]  Qi Zhao,et al.  Webpage Saliency , 2014, ECCV.

[52]  D. Arijon,et al.  Grammar of Film Language , 1976 .

[53]  Raymond Spottiswoode,et al.  A grammar of the film , 1950 .