[发明专利]基于互联网的对商品进行3D在线设计定制及展示的方法

说明书

技术领域

本发明涉及互联网及3D设计技术领域，特别涉及一种基于互联网的对商品进行3D在线设计定制及展示的方法。

背景技术

传统产品展示以图片、视频展示为主，平面化、缺乏交互、传播度低；用户更是被动的接受信息，参与度非常低，显而易见，这样的产品展现不仅没有吸引力，而且对产品本身的表达也非常有限。而且传统产品一直以来智能化、数字化程度不够高、生产力有待优化。

传统的个性化定制技术，采用的是2D平面图片切割，实现部分替换或叠加，定制的结果只能从一个视角展现出来，这样简单合成的定制产品图片真实感差，太过扁平化，在互联网3D时代的今天，已经远远跟不上前进的步伐。

进入互联网3D时代，如何突破现有的展示及个性化定制方式，以使得其更便捷、互动、生动，是当前需要解决的技术问题。

发明内容

本发明的目的旨在至少解决所述技术缺陷之一。

为此，本发明的目的在于提出一种基于互联网的对商品进行3D在线设计定制及展示的方法。

为了实现上述目的，本发明的实施例提供一种基于互联网的对商品进行3D在线设计定制及展示的方法，包括如下步骤：

步骤S1，建立产品的3D设计模型，将该3D设计模型导出为供WebGL渲染的模型格式；

步骤S2，采用在线实时渲染技术将所述步骤S1中建立的3D设计模型在模型展示窗口中加载并显示；

步骤S3，所述模型展示窗口设置有多个功能菜单栏，接收来自用户的针对功能菜单栏的操作指令，控制所述3D设计模型执行相应的动作；

步骤S4，在用户操作的同时，通过3D模型的纹理实时更新技术，所述模型展示窗口中的模型实时显示为用户定制的图像。

进一步，在所述步骤S1中，对该产品建立对应的3D设计模型，并采用预设的个性化定制背景图片替换模型贴图。

进一步，在所述步骤S2中，采用WebGL+HTML5的在线实时渲染技术对3D设计模型进行加载和显示。

进一步，在所述步骤S4中，所述控制所述3D设计模型执行相应的动作，包括:选择3D设计模型的模型贴图、文字，对其内容、样式、颜色、大小及需要显示的位置进行调整。

进一步，当接收到用户的旋转控制指令时，所述旋转控制指令为单指在屏幕上进行上下左右轻扫滑动，控制所述3D设计模型在模型展示窗口中以720度旋转，以便所述用户观看产品设计定制的效果；

当接收到用户的缩放控制指令时，所述缩放控制指令为双指在屏幕上收拢分开，控制所述3D设计模型在模型展示窗口中缩小放大；

当接收到用户的移动控制指令时，所述移动控制指令为单指按住屏幕上进行上下左右拉动，控制所述3D设计模型在模型展示窗口中移动。

进一步，当3D设计模型为平面商品图片时，所述用户通过所述模型展示窗口对其进行在线文字和图片的编辑，设计定制；

对于定制完成的平面商品图片上，禁止他人对其进行在线文字和图片的编辑和设计定制。

进一步，对所述3D设计模型进行设计定制，包括：对该3D设计模型添加文字、静态图片、动态图片以及其他选定的3D模型。

进一步，对所述3D设计模型进行设计定制，包括：更换原3D模型的背景。

根据本发明实施例的基于互联网的对商品进行3D在线设计定制及展示的方法，将产品3D个性化定制建立在网页3D产品展示基础上，可实现对产品外包装全方位上的图片、文字进行个性化定制，用户通过对图片、文字进行随意搭配组合后，实时更新显示到3D产品模型上面去，达到所见即所得的效果，这是传统产品个性化定制无法做到的，通过将网页3D产品展示及3D个性化定制有机结合，带给用户最真实的展示和定制体验。本发明可以广泛适用于微商及APP等电商平台、手机、微信进行三维在线设计定制及浏览，无需安装插件、无需下载模型、实时互动、效果逼真。

本发明附加的方面和优点将在下面的描述中部分给出，部分将从下面的描述中变得明显，或通过本发明的实践了解到。

附图说明

本发明的上述和/或附加的方面和优点从结合下面附图对实施例的描述中将变得明显和容易理解，其中：

图1为根据本发明实施例的基于互联网的对商品进行3D在线设计定制及展示的方法的流程图；

图2为根据本发明实施例的对商品进行3D在线设计定制及展示的浏览界面图；

图3为根据本发明实施例的对3D设计模型添加文字的界面图；

图4为根据本发明实施例的对3D设计模型添加图片的界面图；