Sketch2Code: Evaluating Vision-Language Models for Interactive Web Design Prototyping
On the map: Multimodal LLMs / vision-language models → Chart understanding and anomaly detection
Abstract (arXiv)
Sketches are a natural and accessible medium for UI designers to conceptualize early-stage ideas. However, existing research on UI/UX automation often requires high-fidelity inputs like Figma designs or detailed screenshots, limiting accessibility and impeding efficient design iteration. To bridge this gap, we introduce Sketch2Code, a benchmark that evaluates state-of-the-art Vision Language Models (VLMs) on automating the conversion of rudimentary sketches into webpage prototypes. Beyond end-to-end benchmarking, Sketch2Code supports interactive agent evaluation that mimics real-world design workflows, where a VLM-based agent iteratively refines its generations by communicating with a simulated user, either passively receiving feedback instructions or proactively asking clarification questions. We comprehensively analyze ten commercial and open-source models, showing that Sketch2Code is challenging for existing VLMs; even the most capable models struggle to accurately interpret sketches and formulate effective questions that lead to steady improvement. Nevertheless, a user study with UI/UX experts reveals a significant preference for proactive question-asking over passive feedback reception, highlighting the need to develop more effective paradigms for multi-turn conversational agents.
Key facts. Cited by 29 papers in the map (data through 14 Oct 2026). Placed in Chart understanding and anomaly detection, one of 16 directions in Multimodal LLMs / vision-language models. Builds on 21 of its 83 references that are in the map. First posted on arXiv 21 Oct 2024.
Builds on
21 of 83 references.
Closest ancestors · 1
Same direction, newest first
Other references · 20
- 2019Sentence-BERT: Sentence Embeddings using Siamese BERT-Networkscited by 9,170
- 2021Evaluating Large Language Models Trained on Codecited by 8,320
- 2021Program Synthesis with Large Language Modelscited by 3,637
- 2023SWE-bench: Can Language Models Resolve Real-World GitHub Issues?cited by 3,373
- 2024Gemini 1.5: Unlocking multimodal understanding across millions of tokens of contextcited by 3,224
- 2023InstructBLIP: Towards General-purpose Vision-Language Models with Instruction Tuningcited by 2,876
- 2023Code Llama: Open Foundation Models for Codecited by 2,139
- 2019Generalized Intersection over Union: A Metric and A Loss for Bounding Box Regressioncited by 1,368
- 2024DeepSeek-Coder: When the Large Language Model Meets Programming -- The Rise of Code Intelligencecited by 1,181
- 2024How Far Are We to GPT-4V? Closing the Gap to Commercial Multimodal Models with Open-Source Suitescited by 1,050
- 2023AlpacaFarm: A Simulation Framework for Methods that Learn from Human Feedbackcited by 748
- 2022InCoder: A Generative Model for Code Infilling and Synthesiscited by 498
8 more
- 2017pix2code: Generating Code from a Graphical User Interface Screenshotcited by 114
- 2023At Which Training Stage Does Code Data Help LLMs Reasoning?cited by 82
- 2020Deep Learning for Source Code Modeling and Generation: Models, Applications and Challengescited by 55
- 2024Unveiling the Impact of Coding Data Instruction Fine-Tuning on Large Language Models Reasoningcited by 31
- 2019Sketch2Code: Transformation of Sketches to UI in Real-time Using Deep Neural Networkcited by 23
- 2019Sketch2code: Generating a website from a paper mockupcited by 20
- 2024Frontend Diffusion: Exploring Intent-Based User Interfaces through Abstract-to-Detailed Task Transitionscited by 3
- 2021Automatic code generation from sketches of mobile applications in end-user development using Deep Learningcited by 2
Built on by
Citing papers per year: 2025: 13; 2026: 16.
29 papers.
Sort:
By area:
- 2025BaxBench: Can LLMs Generate Correct and Secure Backends?cited by 41
- 2025RECODE-H: A Benchmark for Research Code Development with Interactive Human Feedbackcited by 25
- 2025VinciCoder: Unifying Multimodal Code Generation via Coarse-to-fine Visual Reinforcement Learningcited by 21
- 2026WebCoderBench: Benchmarking Web Application Generation with Comprehensive and Interpretable Evaluation Metricscited by 18
- 2025P2P: Automated Paper-to-Poster Generation and Fine-Grained Benchmarkcited by 17
- 2025WebMMU: A Benchmark for Multimodal Multilingual Website Understanding and Code Generationcited by 16
- 2025From Code Foundation Models to Agents and Applications: A Comprehensive Survey and Practical Guide to Code Intelligencecited by 15
- 2025FronTalk: Benchmarking Front-End Development as Conversational Code Generation with Multi-Modal Feedbackcited by 14
- 2026WebGameBench: Requirement-to-Application Evaluation for Coding Agents via Browser-Native Gamescited by 12
- 2026MiniAppBench: Evaluating the Shift from Text to Interactive HTML Responses in LLM-Powered Assistantscited by 8
- 2025Generative Interfaces for Language Modelscited by 6
- 2025On the Role of Feedback in Test-Time Scaling of Agentic AI Workflowscited by 4
17 more
- 2026AppWorld-UL: Benchmarking Diverse Agent-User Interactions for Tool-Usecited by 4
- 2025WebRenderBench: Enhancing Web Interface Generation through Layout-Style Consistency and Reinforcement Learningcited by 3
- 2026Vision-Guided Iterative Refinement for Frontend Code Generationcited by 3
- 2025Paper2Web: Let's Make Your Paper Alive!cited by 1
- 20261D-Bench: A Benchmark for Iterative UI Code Generation with Visual Feedback in Real-Worldcited by 1
- 2026Generative Experiences for Digital Mental Health Interventions: Evidence from a Randomized Studycited by 1
- 2026Benchmarking Multimodal LLMs on Code Generation for Complex Interactive Webpagescited by 1
- 2026PPTBench: Can Coding Agents Reconstruct the Visual World through Structured, Editable Slidescited by 1
- 2025Exploring Student Choice and the Use of Multimodal Generative AI in Programming Learningcited by 0
- 2025Sketch-to-Layout: Sketch-Guided Multimodal Layout Generationcited by 0
- 2026CodeMMR: Bridging Natural Language, Code, and Image for Unified Retrievalcited by 0
- 2026LongWebBench: Evaluating Structural and Functional Webpage Generation in Long-Horizon Settingscited by 0
- 2026UI2App: Benchmarking Visual Interaction Inference in Executable Web Application Generationcited by 0
- 2026MV-Bench: Benchmarking Multimodal Large Language Models for Coordinated Multi-View Interface Constructioncited by 0
- 2026Rendering-in-the-Loop: An Execution-Driven Agent for Interactive Web Developmentcited by 0
- 2026Beyond Static Charts: Can Language and Vision Language Models Generate Interactive Data Visualization Interfaces?cited by 0
- 2026AUV-Bench: Aesthetic Understanding and Generation Evaluation for User Interfacescited by 0
- 2026AUV-Bench: Aesthetic Understanding and Generation Evaluation for User Interfaces28 Sep 2026
- 2026Rendering-in-the-Loop: An Execution-Driven Agent for Interactive Web Development2 Sep 2026
- 2026PPTBench: Can Coding Agents Reconstruct the Visual World through Structured, Editable Slides31 Aug 2026
- 2026Beyond Static Charts: Can Language and Vision Language Models Generate Interactive Data Visualization Interfaces?11 Aug 2026
- 2026MV-Bench: Benchmarking Multimodal Large Language Models for Coordinated Multi-View Interface Construction22 Jul 2026
- 2026AppWorld-UL: Benchmarking Diverse Agent-User Interactions for Tool-Use10 Jul 2026
- 2026UI2App: Benchmarking Visual Interaction Inference in Executable Web Application Generation7 Jul 2026
- 2026LongWebBench: Evaluating Structural and Functional Webpage Generation in Long-Horizon Settings16 Jun 2026
- 2026Benchmarking Multimodal LLMs on Code Generation for Complex Interactive Webpages29 May 2026
- 2026WebGameBench: Requirement-to-Application Evaluation for Coding Agents via Browser-Native Games17 May 2026
- 2026CodeMMR: Bridging Natural Language, Code, and Image for Unified Retrieval17 Apr 2026
- 2026Generative Experiences for Digital Mental Health Interventions: Evidence from a Randomized Study8 Apr 2026
17 more
- 2026Vision-Guided Iterative Refinement for Frontend Code Generation7 Apr 2026
- 2026MiniAppBench: Evaluating the Shift from Text to Interactive HTML Responses in LLM-Powered Assistants10 Mar 2026
- 20261D-Bench: A Benchmark for Iterative UI Code Generation with Visual Feedback in Real-World20 Feb 2026
- 2026WebCoderBench: Benchmarking Web Application Generation with Comprehensive and Interpretable Evaluation Metrics5 Jan 2026
- 2025FronTalk: Benchmarking Front-End Development as Conversational Code Generation with Multi-Modal Feedback5 Dec 2025
- 2025From Code Foundation Models to Agents and Applications: A Comprehensive Survey and Practical Guide to Code Intelligence23 Nov 2025
- 2025VinciCoder: Unifying Multimodal Code Generation via Coarse-to-fine Visual Reinforcement Learning1 Nov 2025
- 2025Sketch-to-Layout: Sketch-Guided Multimodal Layout Generation31 Oct 2025
- 2025Paper2Web: Let's Make Your Paper Alive!17 Oct 2025
- 2025RECODE-H: A Benchmark for Research Code Development with Interactive Human Feedback7 Oct 2025
- 2025Exploring Student Choice and the Use of Multimodal Generative AI in Programming Learning6 Oct 2025
- 2025WebRenderBench: Enhancing Web Interface Generation through Layout-Style Consistency and Reinforcement Learning5 Oct 2025
- 2025Generative Interfaces for Language Models26 Aug 2025
- 2025WebMMU: A Benchmark for Multimodal Multilingual Website Understanding and Code Generation22 Aug 2025
- 2025P2P: Automated Paper-to-Poster Generation and Fine-Grained Benchmark21 May 2025
- 2025On the Role of Feedback in Test-Time Scaling of Agentic AI Workflows2 Apr 2025
- 2025BaxBench: Can LLMs Generate Correct and Secure Backends?17 Feb 2025
- 2025From Code Foundation Models to Agents and Applications: A Comprehensive Survey and Practical Guide to Code Intelligencecited by 15
- 2026WebGameBench: Requirement-to-Application Evaluation for Coding Agents via Browser-Native Gamescited by 12
- 2026AppWorld-UL: Benchmarking Diverse Agent-User Interactions for Tool-Usecited by 4
- 2026PPTBench: Can Coding Agents Reconstruct the Visual World through Structured, Editable Slidescited by 1
- 2026Rendering-in-the-Loop: An Execution-Driven Agent for Interactive Web Developmentcited by 0
- 2026Rendering-in-the-Loop: An Execution-Driven Agent for Interactive Web Development2 Sep 2026
- 2026PPTBench: Can Coding Agents Reconstruct the Visual World through Structured, Editable Slides31 Aug 2026
- 2026AppWorld-UL: Benchmarking Diverse Agent-User Interactions for Tool-Use10 Jul 2026
- 2026WebGameBench: Requirement-to-Application Evaluation for Coding Agents via Browser-Native Games17 May 2026
- 2025From Code Foundation Models to Agents and Applications: A Comprehensive Survey and Practical Guide to Code Intelligence23 Nov 2025
- 2026LongWebBench: Evaluating Structural and Functional Webpage Generation in Long-Horizon Settingscited by 0
- 2026MV-Bench: Benchmarking Multimodal Large Language Models for Coordinated Multi-View Interface Constructioncited by 0
- 2026Beyond Static Charts: Can Language and Vision Language Models Generate Interactive Data Visualization Interfaces?cited by 0
- 2026Beyond Static Charts: Can Language and Vision Language Models Generate Interactive Data Visualization Interfaces?11 Aug 2026
- 2026MV-Bench: Benchmarking Multimodal Large Language Models for Coordinated Multi-View Interface Construction22 Jul 2026
- 2026LongWebBench: Evaluating Structural and Functional Webpage Generation in Long-Horizon Settings16 Jun 2026
- 2025BaxBench: Can LLMs Generate Correct and Secure Backends?cited by 41
- 2025VinciCoder: Unifying Multimodal Code Generation via Coarse-to-fine Visual Reinforcement Learningcited by 21
- 2026WebCoderBench: Benchmarking Web Application Generation with Comprehensive and Interpretable Evaluation Metricscited by 18
- 2025P2P: Automated Paper-to-Poster Generation and Fine-Grained Benchmarkcited by 17
- 2025WebMMU: A Benchmark for Multimodal Multilingual Website Understanding and Code Generationcited by 16
- 2025FronTalk: Benchmarking Front-End Development as Conversational Code Generation with Multi-Modal Feedbackcited by 14
- 2026MiniAppBench: Evaluating the Shift from Text to Interactive HTML Responses in LLM-Powered Assistantscited by 8
- 2025Generative Interfaces for Language Modelscited by 6
- 2025WebRenderBench: Enhancing Web Interface Generation through Layout-Style Consistency and Reinforcement Learningcited by 3
- 2026Vision-Guided Iterative Refinement for Frontend Code Generationcited by 3
- 2025Paper2Web: Let's Make Your Paper Alive!cited by 1
- 20261D-Bench: A Benchmark for Iterative UI Code Generation with Visual Feedback in Real-Worldcited by 1
12 most cited of 17 All 17 (JSON)
- 2026AUV-Bench: Aesthetic Understanding and Generation Evaluation for User Interfaces28 Sep 2026
- 2026UI2App: Benchmarking Visual Interaction Inference in Executable Web Application Generation7 Jul 2026
- 2026Generative Experiences for Digital Mental Health Interventions: Evidence from a Randomized Study8 Apr 2026
- 2026Vision-Guided Iterative Refinement for Frontend Code Generation7 Apr 2026
- 2026MiniAppBench: Evaluating the Shift from Text to Interactive HTML Responses in LLM-Powered Assistants10 Mar 2026
- 20261D-Bench: A Benchmark for Iterative UI Code Generation with Visual Feedback in Real-World20 Feb 2026
- 2026WebCoderBench: Benchmarking Web Application Generation with Comprehensive and Interpretable Evaluation Metrics5 Jan 2026
- 2025FronTalk: Benchmarking Front-End Development as Conversational Code Generation with Multi-Modal Feedback5 Dec 2025
- 2025VinciCoder: Unifying Multimodal Code Generation via Coarse-to-fine Visual Reinforcement Learning1 Nov 2025
- 2025Sketch-to-Layout: Sketch-Guided Multimodal Layout Generation31 Oct 2025
- 2025Paper2Web: Let's Make Your Paper Alive!17 Oct 2025
- 2025Exploring Student Choice and the Use of Multimodal Generative AI in Programming Learning6 Oct 2025
12 newest of 17 All 17 (JSON)
Similar, not cited
Close in wording, no citation either way
- 2025WebVIA: A Web-based Vision-Language Agentic Framework for Interactive and Verifiable UI-to-Code Generation
- 2025GraphicBench: A Planning Benchmark for Graphic Design with Language Agents
- 2026Vision2Web: A Hierarchical Benchmark for Visual Website Development with Agent Verification
- 2024SketchAgent: Language-Driven Sequential Sketch Generation
- 2025CANVAS: A Benchmark for Vision-Language Models on Tool-Based User Interface Design
- 2024Design2Code: Benchmarking Multimodal Code Generation for Automated Front-End Engineering
- 2024Interaction2Code: Benchmarking MLLM-based Interactive Webpage Code Generation from Interactive Prototyping
- 2026Enabling Creative Exploration for Vibe Design Agents