一种基于浏览器的交互式设计系统和方法技术方案

本发明专利技术公开了一种基于浏览器的交互式设计系统和方法，包括数据处理模块，数据模块，参数调整模块以及服装呈现模块；数据处理模块用于对上传的服装图像转换为标准化格式文件；数据模块用于解析标准化格式文件，并从中提取款式、服装部件、图案以及环境背景数据分别存储于款式数据库、服装部件数据库、图案数据库以及环境数据库；参数调整模块用于提供款式、环境背景、图案、服装部件以及视角的选择功能，同时提供图案被生成图案时的应用参数；服装呈现模块用于对选择的款式、环境背景、图案、服装部件、视角以及设定的应用参数进行渲染并呈现渲染结果。该系统可以提升图案施加到衣服上的效率。率。率。

【技术实现步骤摘要】
一种基于浏览器的交互式设计系统和方法


[0001]本专利技术属于图像处理与视觉呈现相结合的
，具体涉及一种基于浏览器的交互式设计系统和方法。

技术介绍

[0002]服装设计属于工艺美术范畴，是实用性和艺术性相结合的一种艺术形式。设计意指计划、构思、设立方案，也含有意象、作图、造型之意，而服装设计的定义就是解决人们穿着生活体系中诸问题的富有创造性的计划及创作行为，然而市面上各种的服装设计系统仍存在各种各样的问题。
[0003]服装设计过程中，设计师将图案施加于衣服上一般需要使用Adobe Photoshop或Adobe Illustrator等专业工具手动划分衣服中每个部件的图层，对齐每个部件上图案的大小，重复工作较多，费时费力且效率低下。
[0004]虽然出现了一些服装设计系统，如专利文献CN114049438A公开了一种服装设计系统及服装设计方法，该服装设计主要是对服装的款式进行设计，并不能实现对服装上的图案进行设计。再如专利文献CN111178638A公开了一种服装设计优化系统，主要是对定制服装进行优化，具体优化体型特征比例，但是并不能实现对服装上的图案进行设计。

技术实现思路

[0005]鉴于上述，本专利技术的目的是提供一种基于浏览器的交互式设计系统和方法，提升图案施加到衣服上的效率。
[0006]为实现上述专利技术目的，实施例提供了一种基于浏览器的交互式设计系统，包括数据处理模块，数据模块，参数调整模块以及服装呈现模块；
[0007]所述数据处理模块用于对上传的服装图像转换为标准化格式文件；
[0008]所述数据模块用于解析标准化格式文件，并从中提取款式、服装部件、图案以及环境背景数据分别存储于款式数据库、服装部件数据库、图案数据库以及环境背景数据库；
[0009]所述参数调整模块用于提供款式、环境背景、图案、服装部件以及视角的选择功能，同时提供图案的应用参数；
[0010]所述服装呈现模块用于对选择的款式、环境背景、图案、服装部件、视角以及设定的应用参数进行渲染并呈现渲染结果。
[0011]优选地，所述数据处理模块将服装图像转换为SVG格式文件。
[0012]优选地，所述数据处理模块还对同款式下不同视角的服装部件进行匹配，匹配后的数据文件与SVG格式文件整合转化为标准化格式文件，所述标准化格式文件优选为JSON格式。
[0013]优选地，所述参数调整模块由选择框、滑块、底色颜色选择器组成，实现对应用参数的调整，其中，应用参数包括循环方式、大小、角度、偏移以及底色。
[0014]优选地，所述服装呈现模块包括显示部分和图标部分，其中，显示部分用于呈现渲
染结果，图标部分用作显示部分的操作项，包括上传图案、保存、下载效果图、重置所有、清空当前、撤销、图案详情查看、适应屏幕调整。
[0015]优选地，所述显示部分包括图案图层、底色图层、底图图层、闪烁图层，每个服装部件对应一个图案图层、底色图层以及闪烁图层。
[0016]优选地，选中服装部件的闪烁图层会呈现闪烁；选择的图案和生成的图案被应用于选中服装部件可视化呈现。
[0017]为实现上述专利技术目的，实施例提供了一种云试衣方法，所述方法采用上述基于浏览器的交互式设计系统，所述方法包括以下步骤：
[0018]上传服装图像；
[0019]利用数据处理模块用于对上传的服装图像转换为标准化格式文件；
[0020]利用数据模块解析标准化格式文件，并从中提取款式、服装部件、图案以及环境数据并存储；
[0021]通过参数调整模块选择服装款式、环境背景、图案、服装部件，并调整应用参数；
[0022]利用服装呈现模块对选择的款式、环境背景、图案、服装部件、视角以及设定的应用参数进行渲染并呈现渲染结果。
[0023]与现有技术相比，本专利技术具有的有益效果至少包括：
[0024]将上传的服装图像通过格式转换并解析后形成提取款式、服装部件、图案以及环境背景数据并存储，快速丰富数据库，并以此数据库为基础，为设计师提供可供选择的款式、环境背景、图案、服装部件、视角以及图案被生成图案时的应用参数，这样设计师只需要选择即实现了图案设计过程，设计结果被自动渲染后可视化呈现，大大提升了图案施加于衣服上的效率。
附图说明
[0025]为了更清楚地说明本专利技术实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图做简单地介绍，显而易见地，下面描述中的附图仅仅是本专利技术的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动前提下，还可以根据这些附图获得其他附图。
[0026]图1是实施例提供的基于浏览器的交互式设计系统的结构示意图；
[0027]图2是实施例提供的云试衣方法的流程图。
具体实施方式
[0028]为使本专利技术的目的、技术方案及优点更加清楚明白，以下结合附图及实施例对本专利技术进行进一步的详细说明。应当理解，此处所描述的具体实施方式仅仅用以解释本专利技术，并不限定本专利技术的保护范围。
[0029]图1是实施例提供的基于浏览器的交互式设计系统的结构示意图。如图1所示，实施例提供的基于浏览器的交互式设计系统包括数据处理模块1、数据模块2、参数调整模块3以及服装呈现模块4，该系统在在浏览器呈现。
[0030]实施例中，数据处理模块1用于对上传的服装图像转换为标准化格式文件。其中，上传的服装图像可以是带模特的，也可以是不带模特的，且服装视角各异。输出的标准化文
件格式文件包括SVG格式文件、JSON格式文件。
[0031]数据处理模块主要包含三个部分，第一部分是提供《数据处理手册》，该《数据处理手册》指导设计师怎样使用Adobe Illustrator通过标准化操作将标准格式的服装文件转化为标准格式的SVG文件。通过该《数据处理手册》可以实现利用设计师的知识对服装部件进行划分。由于SVG格式集成了强大的图像处理能力，将服装文件转化为标准格式的SVG文件，方便网页端程序所用。
[0032]第二部分是对同款式下不同视角的服装部件进行匹配。如正视角下服装有“前片”这一部件，后视角下服装有“大身”这一部件。从立体视角看这两个部件有强烈的相关性。为了让切换服装视角后这些相关的服装部件的图案能够相互影响，需要设计师通过数据处理模块执行匹配。
[0033]第三部分是整合上传脚本，将第一部分得到的若干SVG文件及第二部分输出的匹配后数据文件整合转化为JSON格式。整合成JSON格式是为了降低后续网络请求数提升程序响应速度。且JSON格式灵活，能为网页端程序的脚本直接处理，脚本会将处理得到的数据上传至系统中。
[0034]实施例中，数据模块2会请求服务端获取导入系统的标准化格式文件，并解析标准化格式文件，并从中提取款式、服装部件、图案以及环境背景数据分别存储于款式数据库、服装部件数据库、图案数据库以及环境背景数据库。数据库可以存储在云端，存储于数据库的数据可以本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种基于浏览器的交互式设计系统，其特征在于，包括数据处理模块，数据模块，参数调整模块以及服装呈现模块；所述数据处理模块用于对上传的服装图像转换为标准化格式文件；所述数据模块用于解析标准化格式文件，并从中提取款式、服装部件、图案以及环境背景数据分别存储于款式数据库、服装部件数据库、图案数据库以及环境背景数据库；所述参数调整模块用于提供款式、环境背景、图案、服装部件以及视角的选择功能，同时提供图案的应用参数；所述服装呈现模块用于对选择的款式、环境背景、图案、服装部件、视角以及设定的应用参数进行渲染并呈现渲染结果。2.根据权利要求1所述的基于浏览器的交互式设计系统，其特征在于，所述数据处理模块将服装图像转换为SVG格式文件。3.根据权利要求2所述的基于浏览器的交互式设计系统，其特征在于，所述数据处理模块还对同款式下不同视角的服装部件进行匹配，匹配后的数据文件与SVG格式文件整合转化为标准化格式文件，所述标准化格式文件优选为JSON格式。4.根据权利要求1所述的基于浏览器的交互式设计系统，其特征在于，所述参数调整模块由选择框、滑块、底色颜色选择器组成，实现对应用参数的调整，其中，应用参数包括循环方式、大小、角度、偏移以及底色。5.根据权利要求1所...

【专利技术属性】
技术研发人员：易和阳，李楠，
申请(专利权)人：浙江大学，
类型：发明
国别省市：