AwesomeREA.org

2018 · Conference paper

pix2code: Generating Code from a Graphical User Interface Screenshot

Tony Beltramelli

Learns screenshot-to-DSL generation for native Android XML, iOS Storyboards and web HTML/CSS interfaces, then compiles the DSL into platform UI code.

Scope and limitations

Evaluation uses synthetic screenshot/code pairs: 1,500 training and 250 test instances per platform. Reported accuracy concerns DSL tokens, not complete apps or behavior. Text labels are ignored; platform datasets train separate models using the same architecture. The task covers layout, components and relationships, not application logic or backend recovery. The repository describes an educational research prototype; its older dependencies were not runtime-tested.

Why it fits this collection

Adds an early learned screenshot-to-code approach spanning native mobile and web UI reconstruction.

Publication and review details

Venue
EICS 2018
Status
Conference paper
Publication / posting date
June 19, 2018
Date source
ACM-deposited Crossref proceedings metadata: online and print publication on 19 June 2018; arXiv first submitted 22 May 2017.
First arXiv submission
May 22, 2017
arXiv
1705.07962
Reviewed arXiv version
v2
DOI
10.1145/3220134.3220135

The published EICS 2018 proceedings article follows the 2017 arXiv release; this record reviews arXiv v2 dated 19 September 2017. The linked author repository is the implementation identified by that version, reviewed at a current pinned commit rather than claimed to be an unchanged historical release. It contains compiler code and split dataset archives; the actual LICENSE declares Apache 2.0, while the README license badge has a stale filename.

Sources reviewed

Source review only; experiments were not rerun for this collection. Cite the original authors using the linked paper or BibTeX.

Primary sources

  1. https://arxiv.org/abs/1705.07962
  2. https://api.crossref.org/works/10.1145/3220134.3220135
  3. https://arxiv.org/html/1705.07962v2
  4. https://uizard.io/research#pix2code
  5. https://github.com/tonybeltramelli/pix2code/blob/eab4816e397e7491b92bdcb78d9d7195afa412b3/README.md
  6. https://github.com/tonybeltramelli/pix2code/blob/eab4816e397e7491b92bdcb78d9d7195afa412b3/requirements.txt
  7. https://github.com/tonybeltramelli/pix2code/blob/eab4816e397e7491b92bdcb78d9d7195afa412b3/LICENSE