SlideShare a Scribd company logo
1 of 26
Download to read offline
A brief look at visionOS
Ray Yuan Liu
Hi!
劉瑞元 Ray Yuan Liu
- Software Developer
- Tech Lover
- JetBrains 粉絲
Outline
- visionOS SDK
- UI Interactions
- RealityKit
- 3D Model
1
How can I get into VISION PRO 👓
- You can’t purchase a kit yet. (US only)
- Simulator in XCode 15
2
Download Vision SDK
3
Let us replicate a website
- The Inspiration 4 Website
4
UI interactions in Spatial Computing
- Eyes
- Pinch
- New glass effects: glassBackgroundEffect
- Volumetric
z axis
5
glassBackgroundEffect
6
RealityKit
- RealityView
- 3D object as a window
- Work with SwiftUI
- Full immersive Scene
7
RealityView
Load
Scene.usdz
from realitykit
content bundle
Add entity to
RealityView
8
3D object as a window
a volumetric
window
9
3D object as a window
10
Work with SwiftUI
Add view as
attachment
Adjust view
in
RealityView
11
Work with SwiftUI
12
Full immersive Scene
Also can be
a .mixed
mode
13
3D Object
- Model Editor: Reality Composer Pro
- Like Unity
- Built-in particle projector
- Swift code can interact with 3D objects
- Component
- A representation of a geometry or a behavior that you apply to an entity.
- Skybox light (One of a predefined component)
- System
- Use systems to implement any behavior or logic that updates entities every frame.
- e.g. rotation
14
Reality Composer Pro
15
Component
e.g. built-in light effect
Add
components
to a entity
16
17
System
E.g. Custom System with a custom components
Update per
frame 18
System
Register into main entry point
Custom
components and
systems should
be registered
19
System
Custom component: set and get
20
Can I use Unity 3D over Reality Composer Pro?
- Only Pro and Enterprise version can use Vision SDK
- Free version is NOT supported
- Unity Pro annual prepaid pricing will be $2,040/yr
21
Where to get free resources of 3D object?
- Sketchfab
- Download usdz file
22
Let’s
Walkthrough…
23
References
- visionOS Development Fundamentals - Build A VisionOS App From Scratch
- https://www.youtube.com/watch?v=eMA1Vd1nc9M
- RealityKit Documentation
- https://developer.apple.com/documentation/realitykit
24
- https://rayuan.tw
- me@rayuan.tw
- https://www.linkedin.com/in/rayyuanliu/
Find me at

More Related Content

Similar to A brief look at visionOS - How to develop app on Apple's Vision Pro

Getting started with immersive technologies
Getting started with immersive technologiesGetting started with immersive technologies
Getting started with immersive technologiesUchechukwu Obimma
 
Front matter: Next Level Front End Deployments on OpenShift
Front matter: Next Level Front End Deployments on OpenShiftFront matter: Next Level Front End Deployments on OpenShift
Front matter: Next Level Front End Deployments on OpenShiftLance Ball
 
Loopback: An Easy and Robust Mobile Backend - Michael Hantler & Aviv Callande...
Loopback: An Easy and Robust Mobile Backend - Michael Hantler & Aviv Callande...Loopback: An Easy and Robust Mobile Backend - Michael Hantler & Aviv Callande...
Loopback: An Easy and Robust Mobile Backend - Michael Hantler & Aviv Callande...Codemotion Tel Aviv
 
Building Browser VR Experience in React VR
Building Browser VR Experience in React VRBuilding Browser VR Experience in React VR
Building Browser VR Experience in React VRMarcin Mincer
 
Philip Shurpik "Architecting React Native app"
Philip Shurpik "Architecting React Native app"Philip Shurpik "Architecting React Native app"
Philip Shurpik "Architecting React Native app"Fwdays
 
ColdBox APIs + VueJS - powering Mobile, Desktop and Web Apps with 1 VueJS cod...
ColdBox APIs + VueJS - powering Mobile, Desktop and Web Apps with 1 VueJS cod...ColdBox APIs + VueJS - powering Mobile, Desktop and Web Apps with 1 VueJS cod...
ColdBox APIs + VueJS - powering Mobile, Desktop and Web Apps with 1 VueJS cod...Gavin Pickin
 
FrenchKit: SwiftUI Data Flow with Redux
FrenchKit: SwiftUI Data Flow with ReduxFrenchKit: SwiftUI Data Flow with Redux
FrenchKit: SwiftUI Data Flow with ReduxThomasRicouard
 
Responsive Design with Axure 7.0’s Adaptive Views
Responsive Design with Axure 7.0’s Adaptive ViewsResponsive Design with Axure 7.0’s Adaptive Views
Responsive Design with Axure 7.0’s Adaptive ViewsSvetlin Denkov
 
From React to React Native - Things I wish I knew when I started
From React to React Native - Things I wish I knew when I startedFrom React to React Native - Things I wish I knew when I started
From React to React Native - Things I wish I knew when I startedsparkfabrik
 
Flutter vs ReactNative
Flutter vs ReactNativeFlutter vs ReactNative
Flutter vs ReactNativeSumit Sahoo
 
React Native for multi-platform mobile applications
React Native for multi-platform mobile applicationsReact Native for multi-platform mobile applications
React Native for multi-platform mobile applicationsMatteo Manchi
 
Layar Q&A June 2015
Layar Q&A June 2015Layar Q&A June 2015
Layar Q&A June 2015Layar
 
ITB2019 ColdBox APIs + VueJS - powering Mobile, Desktop and Web Apps with 1 V...
ITB2019 ColdBox APIs + VueJS - powering Mobile, Desktop and Web Apps with 1 V...ITB2019 ColdBox APIs + VueJS - powering Mobile, Desktop and Web Apps with 1 V...
ITB2019 ColdBox APIs + VueJS - powering Mobile, Desktop and Web Apps with 1 V...Ortus Solutions, Corp
 
20180518 QNAP Seminar - Introduction to React Native
20180518 QNAP Seminar - Introduction to React Native20180518 QNAP Seminar - Introduction to React Native
20180518 QNAP Seminar - Introduction to React NativeEric Deng
 
Augmenting reality: Bring digital objects into the real world
Augmenting reality: Bring digital objects into the real worldAugmenting reality: Bring digital objects into the real world
Augmenting reality: Bring digital objects into the real worldUnity Technologies
 

Similar to A brief look at visionOS - How to develop app on Apple's Vision Pro (20)

Getting started with android studio
Getting started with android studioGetting started with android studio
Getting started with android studio
 
Getting started with immersive technologies
Getting started with immersive technologiesGetting started with immersive technologies
Getting started with immersive technologies
 
Front matter: Next Level Front End Deployments on OpenShift
Front matter: Next Level Front End Deployments on OpenShiftFront matter: Next Level Front End Deployments on OpenShift
Front matter: Next Level Front End Deployments on OpenShift
 
Loopback: An Easy and Robust Mobile Backend - Michael Hantler & Aviv Callande...
Loopback: An Easy and Robust Mobile Backend - Michael Hantler & Aviv Callande...Loopback: An Easy and Robust Mobile Backend - Michael Hantler & Aviv Callande...
Loopback: An Easy and Robust Mobile Backend - Michael Hantler & Aviv Callande...
 
React native
React nativeReact native
React native
 
Building Browser VR Experience in React VR
Building Browser VR Experience in React VRBuilding Browser VR Experience in React VR
Building Browser VR Experience in React VR
 
Philip Shurpik "Architecting React Native app"
Philip Shurpik "Architecting React Native app"Philip Shurpik "Architecting React Native app"
Philip Shurpik "Architecting React Native app"
 
ColdBox APIs + VueJS - powering Mobile, Desktop and Web Apps with 1 VueJS cod...
ColdBox APIs + VueJS - powering Mobile, Desktop and Web Apps with 1 VueJS cod...ColdBox APIs + VueJS - powering Mobile, Desktop and Web Apps with 1 VueJS cod...
ColdBox APIs + VueJS - powering Mobile, Desktop and Web Apps with 1 VueJS cod...
 
FrenchKit: SwiftUI Data Flow with Redux
FrenchKit: SwiftUI Data Flow with ReduxFrenchKit: SwiftUI Data Flow with Redux
FrenchKit: SwiftUI Data Flow with Redux
 
Responsive Design with Axure 7.0’s Adaptive Views
Responsive Design with Axure 7.0’s Adaptive ViewsResponsive Design with Axure 7.0’s Adaptive Views
Responsive Design with Axure 7.0’s Adaptive Views
 
Devraj_Nataraj_CV_PDF
Devraj_Nataraj_CV_PDFDevraj_Nataraj_CV_PDF
Devraj_Nataraj_CV_PDF
 
From React to React Native - Things I wish I knew when I started
From React to React Native - Things I wish I knew when I startedFrom React to React Native - Things I wish I knew when I started
From React to React Native - Things I wish I knew when I started
 
virtual_chess
virtual_chessvirtual_chess
virtual_chess
 
Flutter vs ReactNative
Flutter vs ReactNativeFlutter vs ReactNative
Flutter vs ReactNative
 
React Native for multi-platform mobile applications
React Native for multi-platform mobile applicationsReact Native for multi-platform mobile applications
React Native for multi-platform mobile applications
 
Layar Q&A June 2015
Layar Q&A June 2015Layar Q&A June 2015
Layar Q&A June 2015
 
ITB2019 ColdBox APIs + VueJS - powering Mobile, Desktop and Web Apps with 1 V...
ITB2019 ColdBox APIs + VueJS - powering Mobile, Desktop and Web Apps with 1 V...ITB2019 ColdBox APIs + VueJS - powering Mobile, Desktop and Web Apps with 1 V...
ITB2019 ColdBox APIs + VueJS - powering Mobile, Desktop and Web Apps with 1 V...
 
20180518 QNAP Seminar - Introduction to React Native
20180518 QNAP Seminar - Introduction to React Native20180518 QNAP Seminar - Introduction to React Native
20180518 QNAP Seminar - Introduction to React Native
 
Swt 2009
Swt 2009Swt 2009
Swt 2009
 
Augmenting reality: Bring digital objects into the real world
Augmenting reality: Bring digital objects into the real worldAugmenting reality: Bring digital objects into the real world
Augmenting reality: Bring digital objects into the real world
 

Recently uploaded

Databricks Generative AI Fundamentals .pdf
Databricks Generative AI Fundamentals  .pdfDatabricks Generative AI Fundamentals  .pdf
Databricks Generative AI Fundamentals .pdfVinayVadlagattu
 
Dr Mrs A A Miraje C Programming PPT.pptx
Dr Mrs A A Miraje C Programming PPT.pptxDr Mrs A A Miraje C Programming PPT.pptx
Dr Mrs A A Miraje C Programming PPT.pptxProfAAMiraje
 
Introduction to Geographic Information Systems
Introduction to Geographic Information SystemsIntroduction to Geographic Information Systems
Introduction to Geographic Information SystemsAnge Felix NSANZIYERA
 
Electromagnetic relays used for power system .pptx
Electromagnetic relays used for power system .pptxElectromagnetic relays used for power system .pptx
Electromagnetic relays used for power system .pptxNANDHAKUMARA10
 
HOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptx
HOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptxHOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptx
HOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptxSCMS School of Architecture
 
scipt v1.pptxcxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx...
scipt v1.pptxcxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx...scipt v1.pptxcxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx...
scipt v1.pptxcxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx...HenryBriggs2
 
Theory of Time 2024 (Universal Theory for Everything)
Theory of Time 2024 (Universal Theory for Everything)Theory of Time 2024 (Universal Theory for Everything)
Theory of Time 2024 (Universal Theory for Everything)Ramkumar k
 
Ground Improvement Technique: Earth Reinforcement
Ground Improvement Technique: Earth ReinforcementGround Improvement Technique: Earth Reinforcement
Ground Improvement Technique: Earth ReinforcementDr. Deepak Mudgal
 
INTERRUPT CONTROLLER 8259 MICROPROCESSOR
INTERRUPT CONTROLLER 8259 MICROPROCESSORINTERRUPT CONTROLLER 8259 MICROPROCESSOR
INTERRUPT CONTROLLER 8259 MICROPROCESSORTanishkaHira1
 
Call for Papers - Journal of Electrical Systems (JES), E-ISSN: 1112-5209, ind...
Call for Papers - Journal of Electrical Systems (JES), E-ISSN: 1112-5209, ind...Call for Papers - Journal of Electrical Systems (JES), E-ISSN: 1112-5209, ind...
Call for Papers - Journal of Electrical Systems (JES), E-ISSN: 1112-5209, ind...Christo Ananth
 
Fundamentals of Structure in C Programming
Fundamentals of Structure in C ProgrammingFundamentals of Structure in C Programming
Fundamentals of Structure in C ProgrammingChandrakantDivate1
 
Computer Graphics Introduction To Curves
Computer Graphics Introduction To CurvesComputer Graphics Introduction To Curves
Computer Graphics Introduction To CurvesChandrakantDivate1
 
PE 459 LECTURE 2- natural gas basic concepts and properties
PE 459 LECTURE 2- natural gas basic concepts and propertiesPE 459 LECTURE 2- natural gas basic concepts and properties
PE 459 LECTURE 2- natural gas basic concepts and propertiessarkmank1
 
Presentation on Slab, Beam, Column, and Foundation/Footing
Presentation on Slab,  Beam, Column, and Foundation/FootingPresentation on Slab,  Beam, Column, and Foundation/Footing
Presentation on Slab, Beam, Column, and Foundation/FootingEr. Suman Jyoti
 
Independent Solar-Powered Electric Vehicle Charging Station
Independent Solar-Powered Electric Vehicle Charging StationIndependent Solar-Powered Electric Vehicle Charging Station
Independent Solar-Powered Electric Vehicle Charging Stationsiddharthteach18
 
Max. shear stress theory-Maximum Shear Stress Theory ​ Maximum Distortional ...
Max. shear stress theory-Maximum Shear Stress Theory ​  Maximum Distortional ...Max. shear stress theory-Maximum Shear Stress Theory ​  Maximum Distortional ...
Max. shear stress theory-Maximum Shear Stress Theory ​ Maximum Distortional ...ronahami
 
DFT - Discrete Fourier Transform and its Properties
DFT - Discrete Fourier Transform and its PropertiesDFT - Discrete Fourier Transform and its Properties
DFT - Discrete Fourier Transform and its PropertiesShiny Christobel
 
Convergence of Robotics and Gen AI offers excellent opportunities for Entrepr...
Convergence of Robotics and Gen AI offers excellent opportunities for Entrepr...Convergence of Robotics and Gen AI offers excellent opportunities for Entrepr...
Convergence of Robotics and Gen AI offers excellent opportunities for Entrepr...ssuserdfc773
 
Passive Air Cooling System and Solar Water Heater.ppt
Passive Air Cooling System and Solar Water Heater.pptPassive Air Cooling System and Solar Water Heater.ppt
Passive Air Cooling System and Solar Water Heater.pptamrabdallah9
 

Recently uploaded (20)

Databricks Generative AI Fundamentals .pdf
Databricks Generative AI Fundamentals  .pdfDatabricks Generative AI Fundamentals  .pdf
Databricks Generative AI Fundamentals .pdf
 
Dr Mrs A A Miraje C Programming PPT.pptx
Dr Mrs A A Miraje C Programming PPT.pptxDr Mrs A A Miraje C Programming PPT.pptx
Dr Mrs A A Miraje C Programming PPT.pptx
 
Introduction to Geographic Information Systems
Introduction to Geographic Information SystemsIntroduction to Geographic Information Systems
Introduction to Geographic Information Systems
 
Electromagnetic relays used for power system .pptx
Electromagnetic relays used for power system .pptxElectromagnetic relays used for power system .pptx
Electromagnetic relays used for power system .pptx
 
HOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptx
HOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptxHOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptx
HOA1&2 - Module 3 - PREHISTORCI ARCHITECTURE OF KERALA.pptx
 
scipt v1.pptxcxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx...
scipt v1.pptxcxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx...scipt v1.pptxcxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx...
scipt v1.pptxcxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx...
 
Theory of Time 2024 (Universal Theory for Everything)
Theory of Time 2024 (Universal Theory for Everything)Theory of Time 2024 (Universal Theory for Everything)
Theory of Time 2024 (Universal Theory for Everything)
 
Signal Processing and Linear System Analysis
Signal Processing and Linear System AnalysisSignal Processing and Linear System Analysis
Signal Processing and Linear System Analysis
 
Ground Improvement Technique: Earth Reinforcement
Ground Improvement Technique: Earth ReinforcementGround Improvement Technique: Earth Reinforcement
Ground Improvement Technique: Earth Reinforcement
 
INTERRUPT CONTROLLER 8259 MICROPROCESSOR
INTERRUPT CONTROLLER 8259 MICROPROCESSORINTERRUPT CONTROLLER 8259 MICROPROCESSOR
INTERRUPT CONTROLLER 8259 MICROPROCESSOR
 
Call for Papers - Journal of Electrical Systems (JES), E-ISSN: 1112-5209, ind...
Call for Papers - Journal of Electrical Systems (JES), E-ISSN: 1112-5209, ind...Call for Papers - Journal of Electrical Systems (JES), E-ISSN: 1112-5209, ind...
Call for Papers - Journal of Electrical Systems (JES), E-ISSN: 1112-5209, ind...
 
Fundamentals of Structure in C Programming
Fundamentals of Structure in C ProgrammingFundamentals of Structure in C Programming
Fundamentals of Structure in C Programming
 
Computer Graphics Introduction To Curves
Computer Graphics Introduction To CurvesComputer Graphics Introduction To Curves
Computer Graphics Introduction To Curves
 
PE 459 LECTURE 2- natural gas basic concepts and properties
PE 459 LECTURE 2- natural gas basic concepts and propertiesPE 459 LECTURE 2- natural gas basic concepts and properties
PE 459 LECTURE 2- natural gas basic concepts and properties
 
Presentation on Slab, Beam, Column, and Foundation/Footing
Presentation on Slab,  Beam, Column, and Foundation/FootingPresentation on Slab,  Beam, Column, and Foundation/Footing
Presentation on Slab, Beam, Column, and Foundation/Footing
 
Independent Solar-Powered Electric Vehicle Charging Station
Independent Solar-Powered Electric Vehicle Charging StationIndependent Solar-Powered Electric Vehicle Charging Station
Independent Solar-Powered Electric Vehicle Charging Station
 
Max. shear stress theory-Maximum Shear Stress Theory ​ Maximum Distortional ...
Max. shear stress theory-Maximum Shear Stress Theory ​  Maximum Distortional ...Max. shear stress theory-Maximum Shear Stress Theory ​  Maximum Distortional ...
Max. shear stress theory-Maximum Shear Stress Theory ​ Maximum Distortional ...
 
DFT - Discrete Fourier Transform and its Properties
DFT - Discrete Fourier Transform and its PropertiesDFT - Discrete Fourier Transform and its Properties
DFT - Discrete Fourier Transform and its Properties
 
Convergence of Robotics and Gen AI offers excellent opportunities for Entrepr...
Convergence of Robotics and Gen AI offers excellent opportunities for Entrepr...Convergence of Robotics and Gen AI offers excellent opportunities for Entrepr...
Convergence of Robotics and Gen AI offers excellent opportunities for Entrepr...
 
Passive Air Cooling System and Solar Water Heater.ppt
Passive Air Cooling System and Solar Water Heater.pptPassive Air Cooling System and Solar Water Heater.ppt
Passive Air Cooling System and Solar Water Heater.ppt
 

A brief look at visionOS - How to develop app on Apple's Vision Pro

Editor's Notes

  1. 用這個 Space X 的網站當成基底來做相關的內容
  2. 修改 intensity 去改有多亮
  3. 自己自訂的 component 和 system 都要在 entry point 註冊