標籤彙整: ar

產生針對 AR 優化的 USDZ 檔案

USDZ 可以想成 USD (Universal Scene Description) 的加強版,這是 Pixar 和 Apple 合作的新格式並針對 AR 優化,雖然是以 zip 封裝,但並沒有壓縮及加密,所以其他程式能直接調用。

目前沒有任何的 3D 繪圖軟體能原生支援此格式,也沒有插件可以使用,原因可能是因為要依附 Xcode 10 的 usdz_converter 工具來產生的關係,所以作業系統必須是 macOS 。

輸入來源可以是 obj 或 usda 格式,大部分的 3D 模型分享網站一定都會有提供 obj 的下載格式,可以從 SketchfabGoogle Poly 找免費的試試看。

 


xcrun usdz_converter cube.obj cube.usdz

使用此指令就能產生 usdz 格式了,但是 obj 使用後只有模型沒有材質!
usdz 採用的是 PBR (Physically based rendering) ,這方面我不懂就不多提了。

xcrun usdz_converter cube.obj cube.usdz \
-g cubeMesh \
-color_map cube_Albedo.png \
-metallic_map cube_Metallic.png \
-roughness_map cube_Roughness.png \
-normal_map .  cube_Normal.png \
-emissive_map  cube_Emissive.png \

反正就是依照圖檔名稱對應相對的指令即可。

 

xcrun usdz_converter -h

使用此指令能看到更詳細的說明

USAGE:
<inFilePath> <outFilePath> [options...]
	Options:
                -g groupName [groupNames ...]       Apply subsequent material properties to the named group(s).
                -m materialName [materialNames ...] Apply subsequent material properties to the named material(s).
                -h                                  Display help.
                -a                                  Generate a .usda intermediate file.  Default is .usdc.
                -l                                  Leave the intermediate .usd file in the source folder.
                -v                                  Verbose output.
                -f                    filePath      Read commands from a file.
                -texCoordSet          set           The name of the texturemap coordinate set to use if multiple exist (no quotes).
                -opacity              o             Floating point value 0.0 ... 1.0
                -color_map            filePath
                -normal_map           filePath
                -emissive_map         filePath
                -metallic_map         filePath
                -roughness_map        filePath
                -ao_map               filePath
                -color_default        r g b a        Floating point values 0.0 ... 1.0
                -normal_default       r g b a
                -emissive_default     r g b a
                -metallic_default     r g b a
                -roughness_default    r g b a
                -ao_default           r g b a

(*) Specify infield only with -v (Verbose) to display group information.
(*) '#' in the first character position of a line in a command file interprets the line as a comment.

 


查了一下能直接線上轉的網站只有 Vectary ,大概要等 Adobe 支援才會有更多人用吧。
有了 usdz 檔案就可以參考這篇文章在網站及 App 中顯示。

 


參考資料
https://developer.apple.com/arkit/
https://graphics.pixar.com/usd/docs/Usdz-File-Format-Specification.html

 

AR Quick Look 讓你在網站及 App 中展示 3D 模型及拍照

AR Quick Look 是 iOS 12 的新功能,可以在網站及 App 中展示 3D 模型,更可以在 AR 模式與之拍照。

以下分別是網站及 App 的程式碼,素材皆來自 AR Quick Look Gallery ,若想自行產生 usdz 格式的檔案請參考這篇文章

 


網站 (只有 iOS 12 Safari 實機才有效果)

&lt;!DOCTYPE html&gt;
&lt;html&gt;
    &lt;head&gt;
        &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"&gt;
        &lt;title&gt;AR Test&lt;/title&gt;
    &lt;/head&gt;
    &lt;body&gt;
        &lt;h1&gt;AR Quick Look in Websites&lt;/h1&gt;
        &lt;p&gt;這是從 https://developer.apple.com/arkit/gallery/ 下載的模型,僅供測試用。&lt;/p&gt;
        &lt;p&gt;需使用 iOS 12 的 Safari 觀看。&lt;/p&gt;
        &lt;a href="cupandsaucer.usdz" rel="ar"&gt;
            &lt;img src="cupandsaucer.jpg" width=200&gt;
        &lt;/a&gt;
    &lt;/body&gt;
&lt;/html&gt;

 


App (只有 iOS 12 實機才有效果)

import UIKit
import QuickLook

class ViewController: UIViewController, QLPreviewControllerDataSource, QLPreviewControllerDelegate {

    override func viewDidLoad() {
        super.viewDidLoad()
        
    }
    
    func numberOfPreviewItems(in controller: QLPreviewController) -> Int {
        
        return 1
    }
    
    func previewController(_ controller: QLPreviewController, previewItemAt index: Int) -> QLPreviewItem {
        
        let url = Bundle.main.url(forResource: "cupandsaucer", withExtension: "usdz")!
        return url as QLPreviewItem
    }
    
    @IBAction func buttonPressed(_ sender: UIButton) {
        
        let previewController = QLPreviewController()
        previewController.dataSource = self
        previewController.delegate = self
        self.present(previewController, animated: true)
    }
}

 


參考資料
https://developer.apple.com/arkit/