在Dynamic Media中使用3D资源

Dynamic Media让您能够上传、管理、视图和交付3D资产,成为沉浸式体验。

  • 单击发布(使用工具栏上的​快速发布)3D资产以生成URL。
  • 借助以Adobe Dimension为后盾的高质量交互式维查看器预设,优化了查看3D资产的支持。
  • 3D Media WCM组件可让您轻松将3D资产添加到AEM Sites页面。

在Dynamic Media中使用3D资产不需要任何其他配置。

3d

Dynamic Media中支持的3D格式

Dynamic Media支持以下3D格式。

另请参阅支持的3D格式。

3D文件扩展名 文件格式 MIME类型 注释
GLB 二进制GL传输 model/gltf-binary 将材料和纹理作为单个资源提供。
OBJ WaveFront 3D对象文件 application/x-tgif
STL 立体光刻 application/vnd.ms-pki.stl
USDZ 通用场景描述Zip存档 model/vnd.usdz+zip 仅支持摄取;没有可用的查看或交互。 USDZ是专有的3D格式,Safari和iOS设备可以本机查看。

快速开始:Dynamic Media中的3D资源

以下工作流分步说明旨在帮助您在Dynamic Media - Scene7模式下快速设置并运行3D资源。

注意

3D资源在Dynamic Media — 混合模式中不受支持。

在Dynamic Media中处理3D资源之前,请确保您的AEM管理员已在Dynamic Media - Scene7模式下启用并配置了Dynamic MediaCloud Services。

请参阅配置Dynamic Media - Scene7模式和Dynamic Media - Scene7模式疑难解答中的 配置Dynamic MediaCloud Services

  1. 上传3D资产

  2. 管理3D资产

  3. 发布3D资产

关于查看3D资产并与之交互

本节介绍如何通过两种不同的方式视图3D资产并与之交互:从资产详细信息页面和站点中的3D媒体组件。

交互式3D查看器包括一组交互式相机控件,这些控件可让您绕行、缩放和平移3D资源。

请注意,在“资产详细信息”页面视图中打开3D资产所花费的时间取决于多个因素。 这些因素包括如下几项:

  • 服务器的带宽。
  • 服务器延迟
  • 图像的复杂性。

此外,在以交互方式操作相机时,还应考虑客户端计算机(如工作站、笔记本或移动触控设备)的功能。 具备良好图形功能的相当强大的系统可以使交互式 3D 查看体验更流畅、更舒适。

小贴士

您可以在查看器预设编辑器中打开维查看器预设,以练习在3D资产上导航,而无需先上传任何3D文件。 “维”查看器预设包含一个内置的3D资源,可供您进行交互。

请参阅管理查看器预设。

从资产详细信息页面查看3D资产并与之交互

另请参阅使用软件界面预览资产

从资产详细信息页面视图3D资产并与之交互

  1. 确保您已将 3D 资产上传到 AEM。

    请参阅上传要在Dynamic Media中使用的3D资产。

  2. 从AEM,在​Navigation​页面上,点按​资产>文件。

  3. 在页面右上角附近,从​视图​下拉列表中,点按​卡视图。

  4. 导航到要查看的 3D 资产。

  5. 点按3D资产的卡片,以在资产详细信息页面中将其打开。

  6. 在3D资产的详细信息视图页面上,执行下列任一操作:

    • 旋转相机 — 围绕3D场景和对象绕行视图。
      • 鼠标:单击左键并拖动。
      • 触摸屏:单指按住并拖动。
    • 平移相机 — 向左、向右、向上或向下平移视图。
      • 鼠标:右键单击并拖动。
      • 触摸屏:用两指按住并拖动。
    • 缩放相机 — 缩放相机以移入和移出3D场景的区域。
      • 鼠标:滚轮。
      • 触摸屏:两指捏。
    • 重新输入您的相机 — 将您的相机重新输入到3D场景中对象上的某个点。
      • 鼠标:多次单击。
      • 触摸屏:多次点击。
    • 重置 — 在页面右下角附近,点按重置图标以将视图目标点恢复到3D资产的中心。重置还会将相机移近或远离资产,以便以合理的查看大小完整显示资产。
    • 全屏模式 — 要进入全屏模式,请点按页面右下角的全屏图标。
  7. 在该页面的右上角,点按​关闭​以返回到“资产”页面。

查看3D媒体组件内的3D资产并与之交互

当网页处于​编辑​模式时,不能与3D资产进行交互。 要使资产具有交互性,您可以使用​预览​功能在页面编辑器中视图网页,以完全访问3D媒体组件的功能。

重要

只有在将3D媒体组件添加到网页并为该组件分配了3D资产后,才能完成此任务。 请参阅将3D媒体组件添加到网页将3D资产分配给3D媒体组件。

另请参阅使用软件界面预览资产。

视图3D媒体组件中的3D资源并与之交互

  1. 当网页处于​编辑​模式时,请执行以下任一操作:

    • 在页面的右上角附近,单击​预览​进入​预览​模式。
    • 从浏览器中的页面URL中删除/editor.html

一个完全交互式的3D资产,如 3D资产在3D媒体组件内显示在预
览模式中显示的完全交互式3D ​资产。

  1. 在​预览​模式下,执行下列任一操作:

    • 旋转相机 — 围绕3D场景和对象绕行视图。
      • 鼠标:单击左键并拖动。
      • 触摸屏:单指按住并拖动。
    • 平移相机 — 向左、向右、向上或向下平移视图。
      • 鼠标:右键单击并拖动。
      • 触摸屏:用两指按住并拖动。
    • 缩放相机 — 缩放相机以移入和移出3D场景的区域。
      • 鼠标:滚轮。
      • 触摸屏:两指捏。
    • 重新输入您的相机 — 将您的相机重新输入到3D场景中对象上的某个点。
      • 鼠标:多次单击。
      • 触摸屏:多次点击。
    • 重置 — 在页面右下角附近,点按重置图标以将视图目标点恢复到3D资产的中心。重置还会将相机移近或远离资产,以便以合理的查看大小完整显示资产。
    • 全屏模式 — 要进入全屏模式,请点按页面右下角的全屏图标。

关于使用3D媒体组件

Dynamic Media包含一个Dynamic Media 3D媒体组件,您可以在AEM Sites中使用它在网页上实现3D模型的交互式查看。

将3D媒体组件添加到页面模板

  1. 导航到​工具>常规>模板。

  2. 导览至要在中启用3D组件的页面模板,然后选择该模板。

  3. 点按​编辑​以打开模板。

  4. 在页面右上角附近的下拉菜单中,选择​结构​模式(如果它尚未处于活动状态)。

    3d-media-component-structure

  5. 点按​布局容器​区域中的空区域以选择它并打开其关联工具栏。

  6. 在工具栏中,点按​策略​图标以打开​策略编辑器。

  7. 在​属性​部分的​允许的组件​选项卡下,滚动至​Dynamic Media,然后展开列表并检查​3D媒体。

  8. 点按​完成​以保存更改并关闭​策略编辑器。

    您现在可以将Dynamic Media 3D媒体组件放置到使用此模板的所有页面上。

将3D媒体组件添加到网页

如果您使用Adobe Experience Manager作为Web内容管理系统,则可以通过3D媒体组件将3D资源添加到网页。

另请参阅将Dynamic Media资产添加到页面。

  1. 打开AEM Sites,选择要向其添加Dynamic Media 3D媒体组件的网页。

  2. 点按​编辑(铅笔)图标以在页面编辑器中打开页面。 确保在页面的右上角附近选择了​编辑​模式。

    3d-media-component-add

  3. 在工具栏中,点按侧面板图标以切换或“打开”面板的显示。

  4. 在侧面板中,点按加号图标以打开​组件​列表。

    3d-media-component-drag-drop

  5. 将​3D Media​组件从​组件​列表拖动到页面上希望显示3D查看器的位置。

现在,您便可以为组件分配3D资产了。

请参阅将3D资产分配给3D媒体组件。

可选 — 配置3D媒体组件

  1. 在AEM Sites页面编辑器中,选择您之前添加到页面的​3D Media Viewer​组件。

  2. 点按​配置​图标(扳手)以打开组件配置对话框。

    3d-media-component-config

  3. 在“3D媒体”对话框的“查看器预设”下拉列表中,选择​Dimensional​以将维查看器预设分配给组件。

    3d-media-component-edit-config

  4. 在右上角,点按复选标记以保存更改。

将3D资产分配给3D媒体组件

在将3D媒体组件添加到网页后,您可以为其分配3D资产。

请参阅将3D媒体组件添加到网页。

  1. 在AEM Sites页面编辑器中,单击​资产​图标以打开侧面板中的​资产

  2. 在下拉列表中,选择​3D​以仅显示3D资产文件类型。

  3. 在侧面板中,搜索或滚动到要在所编辑页面上视图的3D资产。

  4. 将3D资产从“资产”侧面板中拖放到您之前添加到页面的​3D Media​组件上。

    将3d资产分配给3d媒体组件

注意

当网页处于AEM Sites 编辑​模式时,3D Media组件会显示3D资产,但无法与资产交互。 要使资产具有交互性,您可以使用​预览​功能在页面编辑器中视图网页,以完全访问3D媒体组件的功能。

发布静态Dynamic Media 3D资源

Dynamic Media接受Dynamic Media中支持的各种3D文件格式为​static content。 静态内容意味着您可以上传和发布3D资产,但不支持与3D资产关联的​动态​图像或图像重排。 原因是Dynamic Media Imaging Server无法识别3D格式。 因此,在Dynamic Media中发布3D资产后,您可以复制一个即时URL。 3D资产的URL采用通常的Dynamic Media URL结构。 但是,与Dynamic Media中的传统图像资产不同,您无法编辑资产URL中的任何参数。

另请参阅获取静态资产的URL。

在​卡片视图​中,资产名称正下方和日期和时间左侧会显示一个小地球图标,指示资产已发布。 在​列表视图​中,已发布​列显示已发布的资产和未发布的资产。

如果您使用AEM作为WCM,请使用此发布方法直接在您的网页上添加Dynamic Media 3D资源。

另请参阅发布Dynamic Media资源。

另请参阅发布页面。

发布静态Dynamic Media 3D资源

  1. 打开3D资产(GLB、OBJ或STL文件格式),在资产详细信息页面中视图它。

  2. 在工具栏中,点按​快速发布。

    3d-asset-quick-publish

  3. 点按​关闭​以退出对话框并返回到资产详细信息页面。

  4. 从3D资产文件名左侧的下拉列表中,点按​演绎版。

    3d-asset-renditions

  5. 点按​原始。 发布(或“激活”)3D资产后,如果 ​满足以下所有3D资产条件,则URL按钮将显示在页面左下角附近:

    • 3D资产是支持的格式(GLB、OBJ、STL和USDZ)。
    • 3D资源已被引入Dynamic Media Image Production System(IPS)。
    • 将发布3D资产。

    3d-asset-url

  6. 点按​URL​可显示3D资产的直接生产URL,您可以在网页上复制和使用该URL。

使用Dimensional Viewer发布Dynamic Media 3D资源的替代方法

如果您​​使用AEM作为WCM,请使用以下两种方法发布Dynamic Media 3D资产。

On this page

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now