PaperlayerView exact revision on arXiv

Source-linked AI summary

Frontend Diffusion: Empowering Self-Representation of Junior Researchers and Designers Through Multi-agent System

Zijian Ding, Qinshi Zhang, Mohan Chi, Ziyi Wang

arXiv:2502.03788v2cs.HC

TL;DR

Junior researchers and designers need support presenting their professional and personal identities, while AI’s growing coding capabilities raise concerns about replacement. Frontend Diffusion converts sketches and prompts into refined website code through cooperating agents, and a 13-participant study found capability enhancement and bidirectional alignment central to the experience. The study also identifies a narrow participant sample and image relevance as limitations.

  • Problem

    Junior researchers and designers face technical and time constraints when building websites for professional and personal self-representation.

    Source: §I · p. 1

  • Method

    Frontend Diffusion is an end-to-end multi-agent workflow that converts user sketches and prompts into iteratively refined website code and evaluates it through qualitative user study sessions and interviews.

    Source: §I · p. 1, §III · p. 2, §IV · p. 2

  • Results

    A study with 13 participants found AI functioning as a human capability enhancer rather than a replacement and highlighted bidirectional human-AI alignment, including demand for finer-grained user control.

    Source: §V · p. 3

  • Takeaways & Limitations

    Supporting self-representation with multi-agent systems can help users devote more attention to higher-level ideation and reflection while retaining human control over intent.

    Source: §V · p. 3

    The study’s sample included only 13 junior researchers and designers, and public image repositories sometimes produced images misaligned with participants’ identities.

    Source: C. Limitation and Future Work · pp. 4–5

Abstract

from arXiv · show

With the continuous development of generative AI's logical reasoning abilities, AI's growing code-generation potential poses challenges for both technical and creative professionals. But how can these advances be directed toward empowering junior researchers and designers who often require additional help to build and express their professional and personal identities? We introduce Frontend Diffusion, a multi-agent coding system transforming user-drawn layouts and textual prompts into refined website code, thereby supporting self-representation goals. A user study with 13 junior researchers and designers shows AI as a human capability enhancer rather than a replacement, and highlights the importance of bidirectional human-AI alignment. We then discuss future work such as leveraging AI for career development and fostering bidirectional human-AI alignment of multi-agent systems.

I. INTRODUCTION

Generative AI can enhance productivity while raising concerns about replacement, especially for creative professionals. Frontend Diffusion addresses junior researchers’ and designers’ self-representation challenges through an iterative multi-agent website-generation system evaluated with 13 participants.

  • Generative AI’s coding advances have increased productivity but intensified replacement concerns among technical and creative professionals.Source: §I · p. 1
  • Junior researchers often struggle with professional branding and online visibility because creating a personal website is technically difficult and time-consuming.Source: §I · p. 1
  • The system is intended to preserve users’ creative authority while helping them focus on scholarly narratives, research agendas, and distinctive academic identities.Source: §I · p. 1
  • Frontend Diffusion transforms user-drawn layouts and thematic prompts into iteratively refined website code through an open-source, end-to-end multi-agent system.Source: §I · p. 1
  • A user study with 13 participants found AI functioning as a collaborative capability enhancer rather than a replacement, while highlighting bidirectional human-AI alignment.Source: §I · p. 1

II. RELATED WORK

Prior work advances AI-assisted coding, interface generation, design exploration, and feedback, but often prioritizes technical capability over identity expression. Frontend Diffusion extends this work with a three-agent workflow for supporting junior researchers’ and designers’ professional personas.

II. RELATED WORK

  • Existing systems support code generation, screenshot-to-interface synthesis, adaptive UI creation, design inspiration, and automated design feedback.Source: §II · p. 1
  • Frontend development also involves creative workflows in which AI can accelerate prototyping, lower experimentation barriers, provide inspiration, and enable parallel design exploration.Source: §II · pp. 1–2
  • Frontend Diffusion addresses a gap in identity-focused assistance by customizing a multi-agent system for junior researchers and designers to articulate and curate professional personas.Source: §II · p. 2

III. SYSTEM DESIGN

  • The Design Agent converts sketches and prompts into a PRD with layout, component semantics, and image-search keywords, while retrieving illustrative assets.Source: §III · p. 2
  • The Code Agent turns the PRD, image links, and original prompt into initial HTML/CSS/JavaScript, and the Critic Agent reviews and iteratively refines the site.The refinement loop runs for up to n=4 iterations by default, with users able to branch between versions.Source: §III · p. 2

IV. STUDY DESIGN

The study used qualitative user interviews to evaluate both generated personal websites and the human-AI co-creation process. Participants created professional or personal webpages during approximately 45-minute sessions followed by interviews.

  • The evaluation emphasized subjective content and intended messaging alongside general website requirements.Source: §IV · p. 2
  • Each session included 5 minutes of onboarding, 20–30 minutes of website creation, and a 15–20-minute post-study interview.Source: §IV · p. 2
  • Participants created websites presenting research or design portfolios, image galleries, or reading lists after a researcher demonstration.Source: §IV · p. 2

A. Demographic Information

The study collected participant background information and used semi-structured interviews to examine usability, outcomes, improvement needs, and broader perceptions of the tool.

A. Demographic Information

B. Post-Study Interview

  • Post-study interviews asked whether the workflow was smooth, challenging, and successful in capturing users’ intent from sketch to website.Source: B. Post-Study Interview · p. 3
  • Participants were asked which features should improve, whether they wanted more interaction or guidance, and whether they would recommend the tool.Source: B. Post-Study Interview · p. 3
  • The interviews examined whether the tool affected interest in frontend development or research and whether it enhanced human abilities.Source: B. Post-Study Interview · p. 3

C. Data Analysis

Interview transcripts were analyzed with Braun and Clarke’s six-phase thematic analysis framework, using iterative coding, theme refinement, and representative quotations.

  • Researchers repeatedly read transcripts, generated initial codes, and collated them into provisional themes.Source: C. Data Analysis · p. 3
  • Themes were reviewed and refined for coherence and distinctiveness before being finalized.Source: C. Data Analysis · p. 3
  • Each theme was defined and illustrated with representative quotations, while analytic memos supported transparency and rigor.Source: C. Data Analysis · p. 3

V. RESULTS

The results identify AI as a human capability enhancer and characterize bidirectional human–AI alignment through AI- and user-initiated forms of interaction and control.

Theme 1: AI as a Human Capability Enhancer

  • AI can reduce repetitive cognitive and technical burdens, allowing users to focus on higher-level ideation while retaining authority over requirements.Source: §V · p. 3

Theme 2: Bidirectional Human–AI Alignment

  • Bidirectional alignment includes AI-initiated onboarding support and prompt guidance or refinement.Source: §V · p. 3
  • User-initiated alignment includes fine-grained control, unexpected creative sparks, and communication of dynamic behaviors.Source: §V · p. 3
  • Participants sought more granular intent expression despite the system’s high-level sketch and prompt interpretation, including region-specific parameters and hierarchical section prompts.Source: §V · p. 3

A. AI as a Human Capability Enhancer: AI Career Advising and Planning

AI can support career advising and planning by reducing cognitive and technical barriers and offering simulated professional perspectives for self-presentation experiments.

A. AI as a Human Capability Enhancer: AI Career Advising and Planning

B. Bidirectional Human–AI Alignment: Alignment in Hierarchical Multi-agent Systems

Bidirectional alignment in hierarchical multi-agent systems requires support for novice users, prompt refinement, and precise intervention through visible agent roles and direct agent interaction.

B. Bidirectional Human–AI Alignment: Alignment in Hierarchical Multi-agent Systems

C. Limitation and Future Work

The study identifies limitations in participant breadth and image relevance, then proposes future work spanning longitudinal capability enhancement, transparent agent control, and localized data processing.

Limitations

  • The study’s narrow sample of 13 junior researchers and designers did not include participants from non-academic backgrounds.Source: C. Limitation and Future Work · p. 4
  • Publicly sourced images were sometimes perceived as irrelevant or misaligned with participants’ personal or professional identities, potentially affecting user experience.Source: C. Limitation and Future Work · p. 4

Future Work

Loading 2502.03788v2…