User-generated Mappings for Web Design Retargeting Juho Kim CS376: Research Topics in HCI worked with Ranjitha Kumar & Prof. Scott Klemmer

Designed a crowdsourcing interface to collect perceptual correspondences between pairs of web pages.

Goal: Build an automatic retargeting tool that enables using any web page as a design template. Designed an interface that better captures and collects people’s mapping preferences Made design decisions & customized the tool for crowdsourcing Ran a number of pilot sessions with multiple iterations

Demo

Keeping it Simple Serialization

Minimizing Matching Errors Minimizes accidents  Two-click interface Review previous matches  Brushing and linking Precise selection  Bloating parent nodes allows for more of segments. Undo?  Segments can be matched to more than once.

Guiding the Matching Learn the page first: preview Reduce ordering bias: randomized depth-first ordering. Hint: locally-related nodes shown on mouse-over.

Crowdsourced evaluation Collect MTurk data; evaluate and analyze it. Voting interface

Other types of pages Pages that have forked from the same root page Mobile vs. Desktop vs. Print Different versions of the same page over time Multiple pages within a same category: pattern

Help Us Out!