WebViSE: Scaling Visual Design Intelligence from the Open Web for LLM Website Generation
Organizations: Peking University · Baidu Inc., Beijing, China
Abstract
Large language models have made remarkable strides in website development, enabling complete and interactive web experiences to be built from natural-language instructions with far less effort. Yet, non-expert users often struggle to articulate sophisticated visual and interaction designs in natural language. Meanwhile, the open web already contains a vast reservoir of such design knowledge, embodied in mature website implementations. To this end, we introduce Website-derived Visual Skill Extraction (WebViSE), a framework that automatically abstracts these implementations into reusable Visual Skills and builds a structured Skill library. To scale the library, WebViSE organizes its Skills in a multi-parent DAG and jointly evolves Skill descriptions and DAG structure using Skill-conditioned Potential Queries, enabling efficient matching between diverse user instructions and relevant Skills. The auto-evolved structure outperforms non-hierarchical LLM retrieval baselines at only 39.09% of the estimated retrieval cost with Qwen3.8-Max. For any models, WebViSE can be directly injected as plug-and-play guidance, enabling diverse models to produce more visually compelling and aesthetically refined web pages. For open-source models, WebViSE can be used to build a data-synthesis pipeline that internalizes visual design intelligence into model weights. Experiments across multiple web development benchmarks and human evaluation consistently show that WebViSE improves the visual quality and interaction fidelity of artifacts. Overall, our work establishes an automated path for extracting, organizing, and transferring design intelligence from the open web to website-building models. We release all extracted Visual Skills, the associated Skill DAG, and our code at https://github.com/YifeiSun-0710/WebViSE.
Figures & tables
| Model | Setting | WebGen-Bench | MiniAppBench | Cookie-Bench | ||||
|---|---|---|---|---|---|---|---|---|
| Accuracy (%) | Int. | Stat. | Dyn. | Func. | Aes. | Total | ||
| Claude Opus 5 ( Anthropic, 2026 ) | Base | 56.80 | 95.91 | 85.94 | 78.23 | 97.81 | 95.46 | 94.87 |
| +WebViSE | 60.05 3.25 | 95.70 0.21 | 86.44 0.50 | 80.40 2.17 | 96.74 1.07 | 96.52 1.06 | 94.99 0.12 | |
| Kimi K3 ( Kimi Team, 2026 ) | Base | 55.26 | 95.78 | 82.05 | 73.30 | 94.68 | 94.55 | 91.89 |
| +WebViSE | 55.41 0.15 | 95.80 0.02 | 82.60 0.55 | 73.42 0.12 | 96.09 1.41 | 92.95 1.60 | 92.78 0.89 | |
| Qwen3.8-Max ( Qwen Team, 2026b ) | Base | 53.48 | 95.34 | 81.97 | 74.16 | 95.60 | 96.24 | 93.51 |
| Model | Setting | WebGen-Bench | MiniAppBench | Cookie-Bench | ||||
|---|---|---|---|---|---|---|---|---|
| Accuracy (%) | Int. | Stat. | Dyn. | Func. | Aes. | Total | ||
| Claude Opus 5 ( Anthropic, 2026 ) | No Skill | 56.80 | 95.91 | 85.94 | 78.23 | 97.81 | 95.46 | 94.87 |
| +General Skill | 59.20 2.40 | 95.14 0.77 | 85.88 0.06 | 78.22 0.01 | 96.04 1.77 | 95.98 0.52 | 94.15 0.72 | |
| +Random Skill | 50.70 6.10 | 90.31 5.60 | 70.48 15.46 | 64.93 13.30 | 91.77 6.04 | 92.43 3.03 | 91.96 2.91 | |
| +WebViSE | 60.05 3.25 | 95.70 0.21 | 86.44 0.50 | 80.40 2.17 | 96.74 1.07 | 96.52 1.06 | 94.99 0.12 | |
| Qwen3.8-27B ( Qwen Team, 2026a ) | No Skill | 52.86 | 93.45 | 79.06 | 68.85 | 93.98 | 92.95 | 90.13 |
| Method | WebGen-Bench | MiniAppBench | Cookie-Bench | ||||
|---|---|---|---|---|---|---|---|
| Accuracy (%) | Int. | Stat. | Dyn. | Func. | Aes. | Total | |
| Qwen3.8-27B | 52.86 | 93.45 | 79.06 | 68.85 | 93.98 | 92.95 | 90.13 |
| Qwen3.8-27B +WebViSE | 54.40 | 94.93 | 80.63 | 70.04 | 95.50 | 93.97 | 92.20 |
| Qwen3.8-27B NoSkill-SFT | 54.33 | 92.70 | 79.25 | 68.10 | 94.05 | 92.61 | 91.67 |
| Qwen3.8-27B WebViSE-SFT | 53.55 | 93.61 | 79.59 | 70.12 | 93.50 | 94.78 | 92.64 |
| Model | Library structure | Internal source recovery | External Skill utility | Avg. input / output | Relative cost | |||||
|---|---|---|---|---|---|---|---|---|---|---|
| R@1 | R@5 | R@10 | MRR@10 | nDCG@5 | nDCG@10 | Utility R@10 | ||||
| Claude Opus 5 ( Anthropic, 2026 ) | Flat LLM | 0.5065 | 0.7268 | 0.8079 | 0.6028 | 0.6441 | 0.5971 | 0.3437 | 118,822 / 2,975 | 100.00% |
| Initial DAG | 0.5135 | 0.7056 | 0.7679 | 0.5974 | 0.6388 | 0.6029 | 0.3422 | 77,531 / 3,549 | 71.26% | |
| Evolved DAG | 0.5229 | 0.7103 | 0.7762 | 0.6061 | 0.6675 | 0.6198 | 0.3523 | 74,774 / 3,968 | 70.77% | |
| Qwen3.8-Max ( Qwen Team, 2026b ) | Flat LLM | 0.3756 | 0.6015 | 0.6879 | 0.4753 | 0.3330 | 0.3255 | 0.1863 | 67,023 / 749 | 100.00% |
| Initial DAG | 0.4129 | 0.6032 | 0.6785 | 0.4987 | 0.4728 | 0.4419 | 0.2579 | 30,222 / 831 | 47.23% | |
Appendix figures & tables11 assets
Supplementary material from the paper’s appendix.
Appendix
| Instruction | Selected Skill | No Skill | General Website Design Skill | Ours: Website-Derived Visual Skill |
|---|---|---|---|---|
| • split_flap_live_value_board • center_locked_media_row_over_live_backdrop • aperture_framed_scroll_scrubbed_clip | ||||
| • center_out_photo_bloom_with_pointer_drift • edge_following_band_swaps_name_for_drifting_work_run • receding_stage_topic_slides • roaming_contact_sheet_with_lifted_detail | ||||
| • scroll_scrubbed_object_opening_walkthrough | ||||
| • flip_forward_tile_to_fullscreen_detail • spotlight_take_with_picture_trail_to_counter • tilting_stack_card_library • labelled_contrast_flipping_pointer_marker • pointer_trailing_soft_pattern_layer • word_as_window_texture_variant_stage | ||||
| • booting_live_screen_stage • rippling_water_photo_backdrop • flat_fill_panel_curtain_lift_entry | ||||
| • water_shaped_period_row_with_in_column_time_scrub • charging_console_panel_choice_row • cursor_bent_drifting_particle_current |
| Initial Category | Memberships |
|---|---|
| Dimensional Subject Showcase | 78 |
| Ambient Decorative Surface Layer | 85 |
| Presented Visual Media Viewing | 256 |
| Information Graphic Visualization | 21 |
| Explorable Place and Environment | 23 |
| Expressive Interface Control Moment | 74 |
| Parameter | Configuration |
|---|---|
| Base model | Qwen3.8-27B |
| Numerical precision | bfloat16 training with FP32 master parameters |
| Sequence length | 262,144 tokens |
| Sequence packing | Enabled; packing length 262,144; padding-free batches |
| Batch size | Micro batch size 1; global batch size 16 |
| Learning rate | ; constant schedule; no warmup |
| Aspect | WebGen-Bench | MiniAppBench | Cookie-Bench |
|---|---|---|---|
| Evaluated set | All 101 instructions, comprising 647 test cases | The 100-task validation split | The 844-task website subset |
| Dynamic interaction | A WebVoyager agent executes each specified test operation and records the resulting page state | The scoring agent itself uses Playwright to inspect the page, perform clicks and form inputs, and observe page-state changes | A separate Cookie interaction agent autonomously explores the page through an observe–reason–act loop and records the interaction trajectory |
| Interaction model | Seed2.0 Lite ( ByteDance Seed, 2026 ) | GPT-5.4 ( OpenAI, 2026a ) | Seed2.0 Lite ( ByteDance Seed, 2026 ) |
| Scoring model | GPT-5.4 ( OpenAI, 2026a ) | GPT-5.4 ( OpenAI, 2026a ) | GPT-5 ( OpenAI, 2025 ) |
| Scoring evidence | Original task instruction, test operation, expected outcome, action trajectory, and final screenshots | Original task instruction, Eval-Ref, generated code, DOM and CSS inspection, action results, and observed page-state changes | Original task instruction, source code, console logs, rendered screenshots, interaction video, action log, and static-stage scores |
| Evaluation metrics | Accuracy, | Intention, Static, and Dynamic | Functionality, Aesthetics, and Total |
| Model | Setting | Yes | Partial | No | Start Failed | Accuracy (%) |
|---|---|---|---|---|---|---|
| Claude Opus 5 ( Anthropic, 2026 ) | Base | 245 | 245 | 157 | 0 | 56.80 |
| +WebViSE | 262 | 253 | 132 | 0 | 60.05 | |
| Kimi K3 ( Kimi Team, 2026 ) | Base | 239 | 237 | 171 | 0 | 55.26 |
| +WebViSE | 219 | 279 | 149 | 0 | 55.41 | |
| Qwen3.8-Max ( Qwen Team, 2026b ) | Base | 206 | 280 | 161 | 0 | 53.48 |
| +WebViSE | 220 | 281 | 146 | 0 | 55.72 |
| Method | Internal source recovery | External Skill utility | |||||
|---|---|---|---|---|---|---|---|
| R@1 | R@5 | R@10 | MRR@10 | nDCG@5 | nDCG@10 | Utility R@10 | |
| BM25 ( Robertson & Walker, 1994 ) | 0.1232 | 0.2350 | 0.3021 | 0.1743 | 0.1250 | 0.1226 | 0.1004 |
| Dense Retrieval | 0.2047 | 0.3626 | 0.4391 | 0.2723 | 0.2387 | 0.2225 | 0.1278 |
| Hybrid-RRF ( Cormack et al., 2009 ) | 0.1938 | 0.3297 | 0.4144 | 0.2572 | 0.1878 | 0.1794 | 0.1252 |
| PQR ( Kang et al., 2025 ) | 0.2959 | 0.5094 | 0.6153 | 0.3928 | 0.3880 | 0.3662 | 0.2140 |
| ERM ( Hu et al., 2026 ) | 0.2165 | 0.3691 | 0.4459 | 0.2937 | 0.2531 | 0.2374 | 0.1365 |
| Setting | Internal source recovery | External Skill utility | Avg. input / output | Relative cost | |||||
| R@1 | R@5 | R@10 | MRR@10 | nDCG@5 | nDCG@10 | Utility R@10 | |||
| Potential-Query budget | |||||||||
| Flat LLM | 0.3756 | 0.6015 | 0.6879 | 0.4753 | 0.3330 | 0.3255 | 0.1863 | 67,023 / 749 | 100.00% |
| Initial DAG | 0.4129 | 0.6032 | 0.6785 | 0.4987 | 0.4728 | 0.4419 | 0.2579 | 30,222 / 831 | 47.23% |
| 0.25 Q/Skill | 0.4518 | 0.6447 | 0.7203 | 0.5397 | 0.5336 | 0.5025 | 0.2968 | 25,830 / 1,164 | 42.33% |
| 0.5 Q/Skill | 0.4600 | 0.6535 | 0.7221 | 0.5468 | 0.5487 | 0.5037 | 0.2891 | 22,184 / 1,327 | 37.77% |
| Budget | Routing nodes | Max depth | Root-direct Skills | Memberships / Skill | Multi-membership Skills | Active Skills |
|---|---|---|---|---|---|---|
| Initial | 11 | 0 | 864 (100.0%) | 1.09 | 79 | 864 |
| 0.25 Q/Skill | 45 | 1 | 378 (43.8%) | 1.12 | 97 | 864 |
| 0.5 Q/Skill | 107 | 2 | 102 (11.8%) | 1.19 | 148 | 864 |
| 1 Q/Skill | 171 | 2 | 77 (9.0%) | 1.28 | 216 | 857 |
| 2 Q/Skill | 226 | 2 | 31 (3.6%) | 1.46 | 322 | 857 |
Web Application Generation
Web application generation uses AI to turn natural-language, visual, or multimedia specifications into functional, interactive websites and applications.
See all 40 papers