利用多模态大语言模型进行启发式用户界面搜索

研究背景与问题

作者发现了哪些问题或挑战？

作者指出，当前用于用户界面（UI）设计的灵感搜索方法存在以下主要问题和挑战：

1. 现有搜索方法的局限性：
   • 基于像素相似性的检索方法（如Pinterest、Behance和Dribbble等平台）主要关注视觉风格，缺乏深入的语义支持，例如目标用户、应用功能域或情感基调的识别。
   • 依赖元数据（如view hierarchy）的方法受限于元数据的质量和可用性，这限制了其扩展性。
2. 现有平台的手动标注负担：
   • 例如Mobbin等UI策展平台依赖人工为设计分类，这固有地限制了其可扩展性和全面性。
3. 缺乏对设计师需求的全面理解：
   • 设计师具有诸如功能性、用户交互流程、目标受众和情感基调等更加细粒度的语义需求，然而现有工具无法充分支持这些细节。

为什么这个问题很重要？

Inspirational搜索是UI设计过程中至关重要的一个步骤，设计师需要通过搜索现有的界面设计来获取创意。但现有方法无法满足设计师对功能和视觉语义的搜索需求，从而阻碍了其创造性的表达和设计效率的提高。

研究动机与相关工作

• 研究动机：改进UI设计灵感搜索，使其不仅仅局限于视觉元素，还能够综合语义层次的信息（如目标用户、应用角色和情绪基调），从而让搜索结果更加贴近设计师的需求。
• 相关工作：当前基于深度学习和大模型的方法提供了新的可能性，例如采用CLIP模型处理UI的视觉语义相关性检索。然而，这些方法在处理复杂语义上仍有局限，尤其是在语境理解和交互梳理上。

解决方案

作者提出了哪些方法或解决方案？

1. 基于多模态大语言模型（MLLM）处理UI语义信息：

   • 借助MLLM直接从UI屏幕截图中提取UI语义信息，无需依赖元数据或人工标注。
   • 提出了23种语义特征，包括应用类别、目标用户、屏幕角色、界面布局和视觉设计语义，如情绪和颜色。

2. 语义驱动的UI检索系统（S&UI）：

   • 设计并实现了支持多类语义筛选的检索系统S&UI，使得设计师可以通过高精度语义标签轻松找到检索结果。
   • 引入权重调整功能，允许用户根据搜索优先级动态调整查询语义的重要性。

该解决方案的创新之处是什么？

• 直接处理UI截图：利用MLLM从UI视觉信息中自动生成新结构化语义数据，而非依赖现有的元数据。
• 功能和美学的融合：在一个系统中结合功能性（如屏幕角色等）和视觉语义（如情绪、色彩等）的搜索支持。
• 语义透明性和可解释性：检索系统提供详细的语义说明，为搜索结果提供背景支持，帮助设计师快速理解并评估灵感来源。

实施步骤是什么？使用了哪些关键技术？

1. 形成性研究：通过设计师采访确定UI语义元素的重要性，并划分为四个层次：应用、屏幕、组成和视觉设计层语义。
2. 语义信息提取：
   • 使用GPT-4o多模态大语言模型对UI截图进行语义分析。
   • 定义并结构化分类语义（例如，屏幕类别、情绪、颜色等），采用YAML格式确保结果结构清晰易解析。
3. 语义检索系统开发：
   • 使用S&UI系统，支持用户基于语义描述进行查询（如“健康类应用的欢迎屏幕”）。
   • 附加“权重调整”功能，让设计师动态调整搜索参数的优先级。
4. 用户测试和实验验证：
   • 人工和计算评估相结合，验证语义提取精度、查询结果的相关性及系统的可用性。

研究成果

取得了哪些具体成果？

1. 精确语义提取能力：

   • 在复杂语义如应用类别、屏幕角色等任务中，GPT-4o显著优于现有CLIP模型，达到了59.21%的Top-1分类精度。
   • 提供了令人意外（serendipitous）的语义信息，如目标用户和情绪基调，这拓宽了用户的设计思路。

2. 语义检索优越性：

   • S&UI显著提升了检索质量，用户明确指出系统在查询相关性、多样性、结果可靠性上具有明显优势，相比基准系统（如GUIClip），在多种指标上均有显著提升（如相关性从GUIClip的4.9升至S&UI的6.7）。

3. 与人为评估一致：

   • 人类设计师的评价表明，S&UI所提供的功能、外观及迭代性支持极大提高了总体设计效率。

与现有解决方案相比，它有哪些优势？

• 与传统工具的对比：
  • 比视觉主导的平台（如Pinterest或Behance）更能提供与语义匹配的UI示例。
  • 比UI策展工具（如Mobbin）更具动态交互能力，特别是在情绪、角色和目标用户的定制化搜索方面。
• 扩展性强：无需人工标注或繁杂的元数据，适用于多种UI数据集。

实验或评估结果是什么？

1. 通过移动UI数据集（如Enrico和CLAY）的测试，该方法摘录的语义信息在大多数类别上展示了高准确性和全面性。
2. 用户任务评估显示，S&UI可为设计师提供超出预期的多样化灵感，高评分集中在语义的新颖性与深度上。

局限性与未来方向

• 局限性：

  • 当前语义查询依赖手动输入，可能对开放式探索阶段的设计师不友好。
  • 检索方法在查询复杂性增加时，可能会导致相关性下降。
  • 语义提取在布局和UI元素复杂度高的场景下具有局限。

• 未来方向：

  • 引入开放式语义查询功能，根据自由文本自动解析语义实现更加动态的搜索。
  • 在视觉设计和布局理解方面，结合更专注的视觉语言模型或传统深度学习方法进行优化。
  • 扩展到多屏及跨应用分析领域，进一步支持完整用户流的设计探索。

总结

该研究通过结合多模态大语言模型，成功开发了一个语义驱动的UI设计搜索工具，为设计师提供了功能、美学和语义透明性方面的支持。由此奠定了新一代UI灵感搜索工具的基础，有可能大幅提升未来设计系统的智能化和实用性。