一种基于多模态AI的UI生成方法技术

本发明专利技术公开一种基于多模态AI的UI生成方法，获取目标网站官网的需求文档，并根据需求文档将需求细化为对照具体UI界面的不同功能形成功能切面，针对不同的功能切面进行不同维度特征提取形成特征切面；针对不同功能切面提供的特征集合进行融合操作建立特征之间的联系形成需求全面覆盖，并根据融合的特征集结果封装成神经网络预测模型所需特征向量；将特征向量录入到核心为多模态AI技术为驱动的UI自动生成工具中执行UI图像生成功能，预测生成功能需求对应UI图像；对生成的不同功能需求的UI图像进行评审，不足之处参照入参特征进行局部优化以进行二次生成，最后将生成的不同UI交付使用。本发明专利技术有效的缩短了UI设计时间成本。本发明专利技术有效的缩短了UI设计时间成本。本发明专利技术有效的缩短了UI设计时间成本。

【技术实现步骤摘要】
一种基于多模态AI的UI生成方法


[0001]本专利技术涉及图形界面
，尤其涉及一种基于多模态AI的UI生成方法。

技术介绍

[0002]目前软件研发中UI设计从需求文档到UI界面生成完全依靠设计人员，主要的UI设计方式主要分为两种：一种是设计人员通过自身对需求的理解手工绘制UI图，一种是依靠UI界面组件库资源，选用组件库中组件进行UI图设计。该过程需要UI设计人员花大量的时间去构思设计UI，同时针对行业潮流界面所需组件，需求实时积累并更新至组件资源库。设计构思与组件记录过程占用了设计人员大量的时间，同时受个人风格影响所设计的UI，最终呈现效果也很难切实迎合客户需求。
[0003]如图1所示，UI设计人员需要消耗大量时间去构思设计界面，不能更专注于细节的挖掘，传统的UI界面中选用的组件元素，来自于自身组件库积累或组件公开资源库，但是缺陷也很明显，首先业内组件库没有统一资源，针对行业内流行组件元素的出现要不断的更新完善组件库资源，需要时刻关注行业发展趋势，维护成本较高。选取的组件也受设计人员选用角度不同而造成风格差异，当设计人员对需要理解片面、自身知识面狭窄往往造成UI设计图不够人性化、不合符审美需求、图像表征性不强等问题。

技术实现思路

[0004]本专利技术的目的在于提供一种基于多模态AI的UI生成方法。
[0005]本专利技术采用的技术方案是：一种基于多模态AI的UI生成方法，其包括以下步骤：步骤1，获取目标网站官网的需求文档，并根据需求文档将需求细化为对照具体UI界面的不同功能形成功能切面，具体地，以电信集团官网为例，在给出电信集团官网需求文档后，UI设计人员根据需求文档进行功能拆分，将需求细化为可对照具体UI界面的明确功能A(导航栏模块)、功能B(新闻媒体模块)、功能C(商品展示模块)形成功能切面，便于需求变更时复用；步骤2，针对不同的功能切面进行不同维度特征提取形成特征切面；具体地，针对功能A、B、C切面进行不同维度特征提取形成特征切面，如该切面中导航栏包括新闻、企业文化、信息公开、商品专栏等导航，便于用户快速跳转使用该功能，颜色应区别于整体色彩如整体色调白色，导航栏可选用天空蓝或深蓝色色调突出导航的醒目特点，将特征封装成切面目的是让切面复用性更高、灵活性更强；步骤3，针对不同功能切面提供的特征集合进行融合操作建立特征之间的联系形成需求全面覆盖，并根据融合的特征集结果封装成神经网络预测模型所需特征向量；步骤4，将特征向量录入到核心为多模态AI技术为驱动的UI自动生成工具中执行UI图像生成功能，预测生成功能需求对应UI图像；步骤5，对生成的不同功能需求的UI图像进行评审，判断是否符合需求文档要求；
是则，完成UI生成并交付研发；否则，执行步骤4。
[0006]进一步地，步骤1中不同的功能包括导航栏功能、新闻媒体功能和商品展示功能。
[0007]进一步地，步骤4具体包括以下步骤：步骤4
‑
1，根据输入的特征文本向量将特征文本语义利用神经网络模型CLIP提供的文本编码建立特征文本到视觉空间的映射；具体地，该过程是神经网络模型在大量学习了政府、新闻媒体、商城等官网首页数据后，将电信官网特征文本与视觉图像建立联系，形成图文映射关系。
[0008]步骤4
‑
2，通过扩散模型将特征文本的编码在加入特征文本条件的基础上扩散到视觉空间对应的图像编码，步骤4
‑
3，通过GLID生成模型反向扩散从特征文本的表示空间映射到图像空间，生成不同功能需求对应的UI图像。
[0009]进一步的，步骤5中根据需求文档对UI图像进行自我评审是否满足需求文档基本要求；是则，进行归档保存；否则，针对不足之处参照入参特征进行局部优化，并执行步骤4重新选取特征或细化特征指标作为UI生成文本条件进行二次生成。
[0010]具体地，针对生成的UI图像A(导航栏UI)、B(新闻专栏UI)、C(商品专栏)进行评审，首先根据需求文档自我评审是否满足需求文档基本要求，针对不足之处参照入参特征进行局部优化，重新选取特征或细化特征指标作为UI生成文本条件进行二次生成，最后将生成的不同UI进行归档保存以备后续专家评审。
[0011]进一步的，步骤5中对自我评审通过的UI图像进行专家评审。
[0012]进一步的，专家评审时，组织需求方、UI设计、软件研发、市场推广人员参会形成专家评审团，根据最终的UI图像判断是否满足功能基本需求、软件开发可行性、用户审美及功能需要；是则，交付研发；否则，执行步骤4进行回归优化。
[0013]本专利技术采用以上技术方案，以多模态AI技术为驱动的研发需求到UI图像自动生成的解决方案，实现了软件研发领域中自然语言文本描述的研发需求与计算机视觉的结合。目的为UI设计人员提供一种将研发需求自动生成UI图像的方案，并支持根据生成的UI图像继续调整需求文本图像生成特征，用于提升文本渲染与研发需求对应UI图像的相似度，让图像更具表征性，有效的缩短了UI设计时间成本，让即使非专业UI设计人员也能快速的设计出UI图像，同时不会因为UI设计人员的更换造成功能迭代中UI设计风格的断层，生成工具在海量数据支撑下所生成的图像更符合用户需求。与传统利用组件资源库或直接手绘的UI设计的方式相比，具有如下技术特点：1) 生成方式完全不同，传统方式从需求文档到UI图像的生成，完全依赖于UI设计人员编写配置文件与配置文件解析器，该过程中程序编写占用了大量的时间，同时对UI设计人员有较高的编程技术要求，而本专利中根据文本语义可匹配到CLIP神经网络提供的文本编码，文本到图像的生成过程，根据特征文本编码到图像空间中的图像编码映射，自动完成特征文本到图像空间的映射。2) UI界面资源来源不同，传统方式生成的UI完全依赖于UI设计人员组件资源库，需要根据需求实时更新补充组件库资源。本专利资源来源于学习了数以亿级图像的神经网络模型，能很好地建立文本语义与视觉语义之间的映射，同时根据图像被选取的次数权重，自动选取用户欢迎度更高的图像元素。
附图说明
[0014]以下结合附图和具体实施方式对本专利技术做进一步详细说明；图1为现有技术的UI生成方法的流程示意图；图2为本专利技术一种基于多模态AI的UI生成方法的流程示意图。
具体实施方式
[0015]为使本申请实施例的目的、技术方案和优点更加清楚，下面将结合本申请实施例中的附图对本申请实施例中的技术方案进行清楚、完整地描述。
[0016]如图2所示，本专利技术公开了一种基于多模态AI的UI生成方法，其包括以下步骤：步骤1，获取目标网站官网的需求文档，并根据需求文档将需求细化为对照具体UI界面的不同功能形成功能切面，具体地，以电信集团官网为例，在给出电信集团官网需求文档后，UI设计人员根据需求文档进行功能拆分，将需求细化为可对照具体UI界面的明确功能A(导航栏模块)、功能B(新闻媒体模块)、功能C(商品展示模块)形成功能切面，便于需求变更时复用；步骤2，针对不同的功能切面进行不同维度特征提取形成特征切本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种基于多模态AI的UI生成方法，其特征在于：其包括以下步骤：步骤1，获取目标网站官网的需求文档，并根据需求文档将需求细化为对照具体UI界面的不同功能形成功能切面，步骤2，针对不同的功能切面进行不同维度特征提取形成特征切面；步骤3，针对不同功能切面提供的特征集合进行融合操作建立特征之间的联系形成需求全面覆盖，并根据融合的特征集结果封装成神经网络预测模型所需特征向量；步骤4，将特征向量录入到核心为多模态AI技术为驱动的UI自动生成工具中执行UI图像生成功能，预测生成功能需求对应UI图像；步骤5，对生成的不同功能需求的UI图像进行评审，判断是否符合需求文档要求；是则，完成UI生成并交付研发；否则，执行步骤4。2.根据权利要求1所述的一种基于多模态AI的UI生成方法，其特征在于：步骤1中不同的功能包括导航栏功能、新闻媒体功能和商品展示功能。3.根据权利要求1所述的一种基于多模态AI的UI生成方法，其特征在于：步骤4具体包括以下步骤：步骤4
‑
1，根据输入的特征文本向量将特征文本语义利用神经网络模型CLIP提供的文本编码建立特征文本到视觉空间的映射；具体地，该过程是神经网络模型在大量学习了政...

【专利技术属性】
技术研发人员：李哲，郑宗宇，卢佳，
申请(专利权)人：中电福富信息科技有限公司，
类型：发明
国别省市：