போட்டோரியலிஸ்டிக் AR அனுபவங்களைத் திறக்கவும். WebXR லைட்டிங் மதிப்பீட்டு API-ன் அடிப்படைகள், நடைமுறைச் செயல்படுத்தல் மற்றும் எதிர்காலப் போக்குகள் குறித்த எங்கள் விரிவான வழிகாட்டியை ஆராயுங்கள்.
WebXR லைட்டிங் மதிப்பீடு: யதார்த்தமான ஆக்மென்டட் ரியாலிட்டி ரெண்டரிங்கில் ஒரு ஆழமான பார்வை
ஆக்மென்டட் ரியாலிட்டி (AR) நமது டிஜிட்டல் மற்றும் பௌதீக உலகங்களை தடையின்றி ஒன்றிணைக்கும் வாக்குறுதியைக் கொண்டுள்ளது. உங்கள் வரவேற்பறையில் ஒரு மெய்நிகர் சோபாவை வைக்கும் தயாரிப்பு மாதிரிக்காட்சிகளிலும், உங்கள் சமையலறை மேஜையில் கதாபாத்திரங்கள் ஓடும் அதிவேக விளையாட்டுகளிலும், பழங்கால கலைப்பொருட்களுக்கு உயிரூட்டும் கல்விச் செயலிகளிலும் நாம் இதைப் பார்த்திருக்கிறோம். ஆனால், ஒரு நம்பகமான AR அனுபவத்தை, செயற்கையானதாகவும் பொருந்தாததாகவும் உணரும் ஒன்றிலிருந்து எது பிரிக்கிறது? இதற்கான பதில், பெரும்பாலும், ஒளி தான்.
ஒரு டிஜிட்டல் பொருள் அதன் நிஜ-உலகச் சூழலின் ஒளிக்கு ஏற்ப செயல்படாதபோது, நமது மூளை உடனடியாக அதை ஒரு போலியான பொருள் என அடையாளம் கண்டுகொள்கிறது. தட்டையான, பொதுவான ஒளியுடன் கூடிய ஒரு 3D மாடல், திரையில் ஒட்டப்பட்ட ஒரு ஸ்டிக்கர் போல தோன்றி, இருப்பின் மாயையை உடனடியாக உடைக்கிறது. உண்மையான போட்டோரியலிசத்தை அடைய, மெய்நிகர் பொருள்கள் அதே ஒளி மூலங்களால் ஒளிரூட்டப்பட வேண்டும், அதே நிழல்களை உருவாக்க வேண்டும், மற்றும் அவற்றுக்கு அருகிலுள்ள பௌதீகப் பொருட்களைப் போலவே சுற்றியுள்ளவற்றைப் பிரதிபலிக்க வேண்டும். இந்த இடத்தில்தான் WebXR லைட்டிங் மதிப்பீட்டு API வலை உருவாக்குநர்களுக்கு ஒரு மாற்றத்தை உருவாக்கும் கருவியாகிறது.
இந்த விரிவான வழிகாட்டி உங்களை WebXR லைட்டிங் மதிப்பீட்டின் உலகிற்குள் ஒரு ஆழமான பயணத்திற்கு அழைத்துச் செல்லும். AR யதார்த்தத்திற்கு ஒளி ஏன் ஒரு மூலக்கல் என்பதை ஆராய்வோம், API-க்குப் பின்னால் உள்ள தொழில்நுட்பத்தை தெளிவுபடுத்துவோம், நடைமுறைச் செயல்படுத்தும் படிகளைப் பார்ப்போம், மற்றும் அதிவேக இணைய ரெண்டரிங்கின் எதிர்காலத்தை எதிர்நோக்குவோம். இந்த கட்டுரை வலை உருவாக்குநர்கள், 3D கலைஞர்கள், XR ஆர்வலர்கள், மற்றும் அடுத்த தலைமுறை ஈர்க்கக்கூடிய AR அனுபவங்களை நேரடியாக திறந்த இணையத்தில் உருவாக்க விரும்பும் தயாரிப்பு மேலாளர்களுக்கானது.
காணப்படாத சக்தி: யதார்த்தமான AR-க்கு ஒளி ஏன் ஒரு மூலக்கல்
API-ன் தொழில்நுட்ப விவரங்களுக்குள் செல்வதற்கு முன், நம்பகமான AR-ஐ உருவாக்குவதற்கு ஒளி ஏன் மிகவும் அடிப்படையானது என்பதைப் புரிந்துகொள்வது அவசியம். இதன் நோக்கம் "உணர்வுபூர்வமான யதார்த்தம்" (perceptual realism) என்று அழைக்கப்படுவதை அடைவதாகும். இது அதிக விவரமான, மில்லியன் கணக்கான பலகோண மாதிரிகளை உருவாக்குவது பற்றியது அல்ல; இது ஒரு டிஜிட்டல் பொருளை காட்சியின் ஒரு நம்பத்தகுந்த பகுதியாக ஏற்றுக்கொள்ள மனித பார்வை அமைப்பை ஏமாற்றுவது பற்றியது. ஒரு பொருளின் வடிவம், அமைப்பு மற்றும் அதன் சூழலுடனான உறவைப் புரிந்துகொள்ள நமது மூளை பயன்படுத்தும் அத்தியாவசிய காட்சி குறிப்புகளை ஒளி வழங்குகிறது.
நிஜ உலகில் நாம் சாதாரணமாக எடுத்துக்கொள்ளும் யதார்த்தமான ஒளியின் முக்கிய கூறுகளைக் கவனியுங்கள்:
- சுற்றுப்புற ஒளி: இது ஒரு இடத்தை நிரப்பும் மென்மையான, திசையற்ற ஒளி. இது சுவர்கள், கூரைகள் மற்றும் தளங்களில் பட்டு, நேரடி ஒளியில் இல்லாத பகுதிகளை ஒளிரச் செய்கிறது. இது இல்லாமல், நிழல்கள் முற்றிலும் கருமையாக இருக்கும், இது ஒரு இயற்கைக்கு மாறான கடுமையான தோற்றத்தை உருவாக்கும்.
- திசை ஒளி: இது சூரியன் அல்லது ஒரு பிரகாசமான கூரை விளக்கு போன்ற ஒரு முதன்மை, பெரும்பாலும் தொலைதூர மூலத்திலிருந்து வெளிப்படும் ஒளி. இது தனித்துவமான பிரகாசங்களை உருவாக்கி, கூர்மையான விளிம்புகளுடன் கூடிய நிழல்களை வீசுகிறது, ஒரு பொருளின் வடிவம் மற்றும் நிலை பற்றிய வலுவான உணர்வை நமக்குத் தருகிறது.
- பிரதிபலிப்புகள் மற்றும் பளபளப்பு: ஒரு பொருளின் மேற்பரப்பு தன்னைச் சுற்றியுள்ள உலகத்தை எவ்வாறு பிரதிபலிக்கிறது என்பது அதன் பொருள் பண்புகளைப் பற்றி நமக்குக் கூறுகிறது. ஒரு குரோம் கோளம் கூர்மையான, கண்ணாடி போன்ற பிரதிபலிப்புகளைக் கொண்டிருக்கும், ஒரு பிளாஸ்டிக் பொம்மை மென்மையான, மங்கலான பிரகாசங்களைக் கொண்டிருக்கும் (பளபளப்பு), மற்றும் ஒரு மரக்கட்டைக்கு கிட்டத்தட்ட எதுவும் இருக்காது. இந்த பிரதிபலிப்புகள் நம்பகமானதாக இருக்க நிஜ-உலகச் சூழலுடன் பொருந்த வேண்டும்.
- நிழல்கள்: ஒரு பொருளை யதார்த்தத்தில் நிலைநிறுத்துவதற்கான மிக முக்கியமான குறிப்பு நிழல்கள் என்று வாதிடலாம். ஒரு நிழல் ஒரு பொருளை ஒரு மேற்பரப்புடன் இணைக்கிறது, அதற்கு எடையையும் இட உணர்வையும் அளிக்கிறது. ஒரு நிழலின் மென்மை, திசை மற்றும் நிறம் ஆகியவை சூழலில் உள்ள ஒளி மூலங்களைப் பற்றிய ஏராளமான தகவல்களை வழங்குகின்றன.
உங்கள் அலுவலகத்தில் ஒரு மெய்நிகர், பளபளப்பான சிவப்பு கோளத்தை வைப்பதாக கற்பனை செய்து பாருங்கள். இயல்பான, காட்சி அடிப்படையிலான ஒளியுடன், அது ஒரு பொதுவான வெள்ளை பிரகாசத்தையும், ஒரு எளிய, இருண்ட வட்ட நிழலையும் கொண்டிருக்கலாம். அது போலியாகத் தெரிகிறது. இப்போது, லைட்டிங் மதிப்பீட்டுடன், அதே கோளம் உங்கள் மானிட்டரிலிருந்து வரும் நீல ஒளியையும், மேஜை விளக்கிலிருந்து வரும் சூடான மஞ்சள் ஒளியையும், ஜன்னலின் சிதைந்த பிரதிபலிப்பையும் கூட பிரதிபலிக்க முடியும். அதன் நிழல் மென்மையாகவும், முதன்மை ஒளி மூலத்திலிருந்து சரியாக கோணத்தில் விலகியும் உள்ளது. திடீரென்று, அந்த கோளம் உங்கள் மேஜையில் இருப்பது போல் மட்டும் தெரியவில்லை; அது உங்கள் மேஜையின் சூழலில் இருப்பது போல் தெரிகிறது. இதுதான் யதார்த்தமான ஒளியின் சக்தி, இதைத்தான் WebXR லைட்டிங் மதிப்பீட்டு API திறக்கிறது.
WebXR லைட்டிங் மதிப்பீட்டு API-ஐப் புரிந்துகொள்ளுதல்
WebXR லைட்டிங் மதிப்பீட்டு API என்பது பரந்த WebXR சாதன API விவரக்குறிப்புக்குள் உள்ள ஒரு தொகுதியாகும். அதன் நோக்கம் எளிமையானது ஆனால் சக்தி வாய்ந்தது: சாதனத்தின் கேமரா மூலம் பயனரின் நிஜ-உலகச் சூழலை பகுப்பாய்வு செய்து, டெவலப்பரின் 3D ரெண்டரிங் இயந்திரத்திற்கு (Three.js அல்லது Babylon.js போன்றவை) செயல்படக்கூடிய லைட்டிங் தரவை வழங்குவதாகும். இது ஒரு பாலமாக செயல்படுகிறது, உங்கள் மெய்நிகர் காட்சியின் ஒளியை உண்மையான பௌதீக காட்சியின் ஒளியால் இயக்க அனுமதிக்கிறது.
இது எப்படி வேலை செய்கிறது? ஒரு எளிமைப்படுத்தப்பட்ட பார்வை
இந்த செயல்முறை மாயாஜாலத்தை உள்ளடக்கவில்லை; இது கணினி பார்வையின் ஒரு அதிநவீன பயன்பாடு. லைட்டிங் மதிப்பீடு இயக்கப்பட்ட ஒரு WebXR அமர்வு செயலில் இருக்கும்போது, அதன் அடிப்படையிலான தளம் (ஆண்ட்ராய்டில் கூகிளின் ARCore போன்றவை) தொடர்ந்து கேமரா ஊட்டத்தை பகுப்பாய்வு செய்கிறது. இந்த பகுப்பாய்வு சுற்றுப்புற ஒளியின் பல முக்கிய பண்புகளை ஊகிக்கிறது:
- ஒட்டுமொத்த பிரகாசம் மற்றும் நிறம்: இது ஒளியின் முக்கிய தீவிரம் மற்றும் வண்ணச் சாயலை தீர்மானிக்கிறது. அறை குளிர்ச்சியான, வெள்ளை ஒளிரும் பல்புகளால் பிரகாசமாக ஒளிரூட்டப்பட்டுள்ளதா, அல்லது ஒரு சூடான, ஆரஞ்சு சூரிய அஸ்தமனத்தால் மங்கலாக ஒளிரூட்டப்பட்டுள்ளதா?
- ஒளி திசையமைவு: இது ஒவ்வொரு ஒளி விளக்கையும் துல்லியமாகக் குறிப்பிடவில்லை என்றாலும், இது மிகவும் ஆதிக்கம் செலுத்தும் ஒளி மூலங்களின் பொதுவான திசையைத் தீர்மானிக்க முடியும்.
- சுற்றுச்சூழல் பிரதிநிதித்துவம்: மிக முக்கியமாக, இது எல்லா திசைகளிலிருந்தும் வரும் ஒளியின் முழுமையான பிரதிநிதித்துவத்தை உருவாக்குகிறது.
இந்தத் தகவல் பின்னர் நிகழ்நேர 3D கிராபிக்ஸ் ரெண்டரிங்கிற்கு மிகவும் உகந்த வடிவங்களில் தொகுக்கப்படுகிறது. API வழங்கும் இரண்டு முதன்மை தரவு வடிவங்கள் கோள ஹார்மோனிக்ஸ் (Spherical Harmonics) மற்றும் ஒரு பிரதிபலிப்பு க்யூப்மேப் (Reflection Cubemap) ஆகும்.
API தரவின் இரண்டு முக்கிய கூறுகள்
உங்கள் WebXR அமர்வில் நீங்கள் ஒரு ஒளி மதிப்பீட்டைக் கோரும்போது, உங்களுக்கு ஒரு `XRLightEstimate` பொருள் கிடைக்கும். இந்த பொருள் உங்கள் ரெண்டரர் பயன்படுத்தும் இரண்டு முக்கியமான தரவுத் துண்டுகளைக் கொண்டுள்ளது.
1. பரவல் ஒளிக்கான கோள ஹார்மோனிக்ஸ் (SH)
இது ஒருவேளை மிகவும் சிக்கலானதாகத் தோன்றும் ஆனால் API-ன் அடிப்படையில் முக்கியமான பகுதியாகும். எளிமையான சொற்களில், கோள ஹார்மோனிக்ஸ் என்பது எல்லா திசைகளிலிருந்தும் குறைந்த-அதிர்வெண் (அதாவது மென்மையான மற்றும் மங்கலான) ஒளித் தகவல்களைக் குறிப்பிடுவதற்கான ஒரு கணித வழியாகும். இதை ஒரு காட்சியில் உள்ள ஒட்டுமொத்த சுற்றுப்புற ஒளியின் மிகவும் சுருக்கப்பட்ட, திறமையான சுருக்கமாக நினைத்துப் பாருங்கள்.
- இது எதற்காக: இது ஒரு பொருளைத் தாக்கும் பரவல் ஒளியைக் கணக்கிட ஏற்றது. பரவல் ஒளி என்பது மரம், கல் அல்லது மெருகூட்டப்படாத பிளாஸ்டிக் போன்ற மந்தமான பொருட்களின் மேற்பரப்பில் சமமாக சிதறும் ஒளி. SH இந்த மேற்பரப்புகளுக்கு சூழலின் சுற்றுப்புற ஒளிக்கு சார்பாக அவற்றின் நோக்குநிலையின் அடிப்படையில் சரியான நிறத்தையும் நிழலையும் அளிக்கிறது.
- இது எப்படி வழங்கப்படுகிறது: API ஆனது SH தரவை குணகங்களின் வரிசையாக (பொதுவாக 3வது வரிசை ஹார்மோனிக்ஸிற்கான 27 மதிப்புகளுடன் ஒரு `Float32Array`) வழங்குகிறது. இந்த எண்களை நேரடியாக நவீன இயற்பியல்-அடிப்படையிலான ரெண்டரிங் (PBR) ஷேடர்களில் பயன்படுத்தலாம், அவை மந்தமான மேற்பரப்பில் உள்ள ஒவ்வொரு பிக்சலின் இறுதி நிறத்தைக் கணக்கிட இவற்றைப் பயன்படுத்துகின்றன.
2. பளபளப்பான ஒளிக்கான பிரதிபலிப்பு க்யூப்மேப்கள்
மந்தமான மேற்பரப்புகளுக்கு கோள ஹார்மோனிக்ஸ் சிறந்தது என்றாலும், பளபளப்பானவற்றுக்குத் தேவையான விவரம் அதில் இல்லை. அந்த இடத்தில்தான் பிரதிபலிப்பு க்யூப்மேப் வருகிறது. ஒரு க்யூப்மேப் என்பது ஒரு கனசதுரத்தின் முகங்களைப் போல அமைக்கப்பட்ட ஆறு டெக்ஸ்சர்களைக் கொண்ட ஒரு உன்னதமான கணினி வரைகலை நுட்பமாகும். ஒன்றாக, அவை ஒரு புள்ளியிலிருந்து சூழலின் 360-டிகிரி பரந்த படத்தை உருவாக்குகின்றன.
- இது எதற்காக: க்யூப்மேப் ஆனது பளபளப்பான (shiny) மேற்பரப்புகளில் கூர்மையான, விரிவான பிரதிபலிப்புகளை உருவாக்கப் பயன்படுகிறது. நீங்கள் ஒரு உலோக அல்லது பளபளப்பான பொருளை ரெண்டர் செய்யும்போது, அதன் மேற்பரப்பில் என்ன பிரதிபலிக்க வேண்டும் என்பதைக் கண்டுபிடிக்க ரெண்டரிங் இயந்திரம் க்யூப்மேப்பைப் பயன்படுத்துகிறது. ஒரு மெய்நிகர் குரோம் பந்தில் உண்மையான அறையின் யதார்த்தமான பிரதிபலிப்பைக் காண்பது போட்டோரியலிசத்தை அடைவதில் ஒரு முக்கிய காரணியாகும்.
- இது எப்படி வழங்கப்படுகிறது: API இதை ஒரு `XRReflectionCubeMap` ஆக வழங்குகிறது, இது உங்கள் 3D காட்சியில் ஒரு சூழல் வரைபடமாக நேரடியாகப் பயன்படுத்தக்கூடிய ஒரு `WebGLTexture` பொருளாகும். பயனர் நகரும்போது அல்லது லைட்டிங் நிலைமைகள் மாறும்போது இந்த க்யூப்மேப் கணினியால் மாறும் வகையில் புதுப்பிக்கப்படுகிறது.
நடைமுறைச் செயல்படுத்தல்: உங்கள் WebXR செயலிக்கு லைட்டிங் மதிப்பீட்டைக் கொண்டு வருதல்
இப்போது நாம் கோட்பாட்டைப் புரிந்துகொண்டோம், இந்த அம்சத்தை ஒரு WebXR பயன்பாட்டில் ஒருங்கிணைக்கத் தேவையான உயர்-நிலை படிகளைப் பார்ப்போம். முழுமையான செயல்படுத்தல் குறியீடு சிக்கலானதாகவும், உங்கள் 3D நூலகத் தேர்வைப் பெரிதும் சார்ந்தும் இருந்தாலும், முக்கிய செயல்முறை ஒரு சீரான முறையைப் பின்பற்றுகிறது.
முன்நிபந்தனைகள்
- ஒரு அமர்வைத் தொடங்கி ரெண்டர் லூப்பை இயக்குவது உட்பட, WebXR-இன் அடிப்படைகளைப் பற்றிய ஒரு திடமான புரிதல்.
- Three.js அல்லது Babylon.js போன்ற WebGL-அடிப்படையிலான 3D நூலகத்துடன் பரிச்சயம். இந்த நூலகங்கள் குறைந்த-நிலை சிக்கல்களில் பெரும்பாலானவற்றை எளிதாக்குகின்றன.
- ஒரு இணக்கமான சாதனம் மற்றும் உலாவி. இந்த எழுத்தின் படி, WebXR லைட்டிங் மதிப்பீடு ARCore உடன் நவீன ஆண்ட்ராய்டு சாதனங்களில் Chrome-ல் மிகவும் வலுவாக ஆதரிக்கப்படுகிறது.
- HTTPS: அனைத்து WebXR அம்சங்களைப் போலவே, உங்கள் தளமும் ஒரு பாதுகாப்பான இணைப்பு வழியாக வழங்கப்பட வேண்டும்.
படிப்படியான ஒருங்கிணைப்பு (கருத்தியல்)
தேவையான படிகளின் ஒரு கருத்தியல் கண்ணோட்டம் இங்கே. அடுத்த பகுதியில் நூலக-குறிப்பிட்ட உதவிகளைப் பற்றி விவாதிப்போம்.
படி 1: 'light-estimation' அம்சத்தைக் கோருங்கள்
உங்கள் AR அமர்வை உருவாக்கும்போது நீங்கள் வெளிப்படையாகக் கோரினால் தவிர, இந்த API-ஐப் பயன்படுத்த முடியாது. உங்கள் `requestSession` அழைப்பில் `requiredFeatures` அல்லது `optionalFeatures` வரிசையில் 'light-estimation'-ஐச் சேர்ப்பதன் மூலம் இதைச் செய்கிறீர்கள்.
const session = await navigator.xr.requestSession('immersive-ar', { requiredFeatures: ['hit-test', 'dom-overlay', 'light-estimation'] });
படி 2: ஒரு XRLightProbe-ஐ உருவாக்குங்கள்
அமர்வு தொடங்கியவுடன், நீங்கள் லைட்டிங் தகவல்களைப் பெறத் தொடங்க விரும்புகிறீர்கள் என்று அதற்குச் சொல்ல வேண்டும். அமர்வுக்காக ஒரு லைட் ப்ரோபை உருவாக்குவதன் மூலம் இதைச் செய்கிறீர்கள். நீங்கள் விரும்பும் பிரதிபலிப்பு வரைபட வடிவத்தையும் குறிப்பிடலாம்.
const lightProbe = await session.requestLightProbe();
படி 3: ரெண்டர் லூப்பில் லைட்டிங் தரவை அணுகவும்
லைட்டிங் தரவு ஒவ்வொரு பிரேமுடனும் புதுப்பிக்கப்படுகிறது. உங்கள் `requestAnimationFrame` ரெண்டர் லூப் கால்பேக்கினுள் (`time` மற்றும் `frame`-ஐ வாதங்களாகப் பெறுகிறது), உங்கள் ப்ரோபிற்கான சமீபத்திய மதிப்பீட்டைப் பெறலாம்.
function onXRFrame(time, frame) {
// ... get pose, etc. ...
const lightEstimate = frame.getLightEstimate(lightProbe);
if (lightEstimate) {
// எங்களிடம் லைட்டிங் தரவு உள்ளது! இப்போது அதைப் பயன்படுத்தலாம்.
applyLighting(lightEstimate);
}
// ... render the scene ...
}
`lightEstimate` இருக்கிறதா என்று சோதிப்பது முக்கியம், ஏனெனில் அமர்வு தொடங்கிய பிறகு முதல் மதிப்பீட்டை உருவாக்க கணினிக்கு சில பிரேம்கள் ஆகலாம்.
படி 4: உங்கள் 3D காட்சிக்கு தரவைப் பயன்படுத்துங்கள்
இந்த இடத்தில்தான் உங்கள் 3D இயந்திரம் வருகிறது. `lightEstimate` பொருள் `sphericalHarmonicsCoefficients` மற்றும் `reflectionCubeMap`-ஐக் கொண்டுள்ளது.
- கோள ஹார்மோனிக்ஸைப் பயன்படுத்துதல்: நீங்கள் `sphericalHarmonicsCoefficients` வரிசையை உங்கள் PBR மெட்டீரியல்களுக்கு அனுப்புவீர்கள், பெரும்பாலும் உங்கள் 3D இயந்திரத்திற்குள் ஒரு `LightProbe` பொருளைப் புதுப்பிப்பதன் மூலம். இயந்திரத்தின் ஷேடர்கள் பின்னர் இந்தத் தரவைப் பயன்படுத்தி பரவல் ஒளியைக் கணக்கிடுகின்றன.
- பிரதிபலிப்பு க்யூப்மேப்பைப் பயன்படுத்துதல்: `reflectionCubeMap` ஒரு `WebGLTexture` ஆகும். உங்கள் ரெண்டரர் பயன்படுத்தக்கூடிய ஒரு பதிப்பைப் பெற உங்கள் அமர்வின் `XRWebGLBinding`-ஐப் பயன்படுத்த வேண்டும், பின்னர் அதை உங்கள் காட்சியின் உலகளாவிய சூழல் வரைபடமாக அமைக்க வேண்டும். இது ஒரு உலோகம் அல்லது கடினத்தன்மை மதிப்பு கொண்ட அனைத்து PBR மெட்டீரியல்களையும் அதை பிரதிபலிக்கச் செய்யும்.
இயந்திர-குறிப்பிட்ட எடுத்துக்காட்டுகள்: Three.js மற்றும் Babylon.js
அதிர்ஷ்டவசமாக, பிரபலமான WebGL நூலகங்கள் படி 4-இல் உள்ள பெரும்பாலான கடினமான வேலைகளைக் கையாளுகின்றன, இது டெவலப்பர்களுக்கு செயல்முறையை மிகவும் எளிதாக்குகிறது.
Three.js செயல்படுத்தல் குறிப்புகள்
Three.js ஒரு விதிவிலக்கான `WebXRManager`-ஐயும், லைட்டிங் மதிப்பீட்டை கிட்டத்தட்ட ஒரு பிளக்-அண்ட்-ப்ளே அம்சமாக மாற்றும் ஒரு பிரத்யேக உதவி வகுப்பையும் கொண்டுள்ளது.
XREstimatedLight
வகுப்புதான் முக்கியமானது. இந்த வகுப்பின் ஒரு நிகழ்வை உருவாக்கி அதை உங்கள் காட்சிக்குச் சேர்க்கலாம். உங்கள் ரெண்டர் லூப்பில், நீங்கள் `xrFrame.getLightEstimate(lightProbe)` முடிவையும், `lightProbe`-ஐயும் ஒளியின் `update()` முறைக்கு அனுப்புகிறீர்கள். உதவி வகுப்பு மற்ற அனைத்தையும் கவனித்துக் கொள்கிறது:
- இது ஒரு Three.js `LightProbe` பொருளைக் கொண்டுள்ளது மற்றும் அதன் `sh` பண்பை கோள ஹார்மோனிக்ஸ் குணகங்களுடன் தானாகவே புதுப்பிக்கிறது.
- இது `scene.environment` பண்பை பிரதிபலிப்பு க்யூப்மேப்புடன் தானாகவே புதுப்பிக்கிறது.
- ஒளி மதிப்பீடு கிடைக்காதபோது, இது ஒரு இயல்புநிலை லைட்டிங் அமைப்பிற்குத் திரும்பும், இது ஒரு மென்மையான அனுபவத்தை உறுதி செய்கிறது.
இந்த உயர்-நிலை சுருக்கம், டெக்ஸ்சர்களை பிணைப்பது மற்றும் ஷேடர் யூனிஃபார்ம்களைப் புதுப்பிப்பது போன்ற சிக்கல்களை `XREstimatedLight` கையாள அனுமதித்து, உங்கள் 3D உள்ளடக்கத்தை உருவாக்குவதில் நீங்கள் கவனம் செலுத்தலாம் என்பதைக் குறிக்கிறது.
Babylon.js செயல்படுத்தல் குறிப்புகள்
Babylon.js அதன் `WebXRDefaultExperience` உதவிக்காக ஒரு உயர்-நிலை, அம்சம்-அடிப்படையிலான அமைப்பையும் வழங்குகிறது.
இந்த அம்சத்தை இயக்க, நீங்கள் அம்ச மேலாளரை அணுகி அதன் பெயரால் அதை இயக்கவும்:
const xr = await scene.createDefaultXRExperienceAsync({ /* options */ });
const lightEstimationFeature = xr.featuresManager.enableFeature(WebXRLightEstimation.Name, { /* options */ });
இயக்கப்பட்டவுடன், இந்த அம்சம் தானாகவே:
- `XRLightProbe`-இன் உருவாக்கம் மற்றும் வாழ்க்கைச் சுழற்சியை நிர்வகிக்கிறது.
- காட்சியின் முக்கிய `environmentTexture`-ஐ API வழங்கும் பிரதிபலிப்பு க்யூப்மேப்புடன் புதுப்பிக்கிறது.
- கோள ஹார்மோனிக்ஸ் குணகங்களுக்கான அணுகலை வழங்குகிறது, இது Babylon-இன் PBR மெட்டீரியல் அமைப்பு பரவல் ஒளி கணக்கீடுகளுக்குப் பயன்படுத்தலாம்.
- புதிய லைட்டிங் தரவு வரும்போது தனிப்பயன் தர்க்கத்திற்காக நீங்கள் குழுசேரக்கூடிய `onLightEstimatedObservable` போன்ற பயனுள்ள அவதானிக்கக்கூடிய நிகழ்வுகளை (events) உள்ளடக்கியது.
Three.js-ஐப் போன்ற இந்த அணுகுமுறை, டெவலப்பர்கள் இந்த மேம்பட்ட அம்சத்தை ஒரு சில வரிக் குறியீட்டில் தேர்வுசெய்ய அனுமதிக்கிறது, இது ஏற்கனவே உள்ள Babylon.js ரெண்டரிங் பைப்லைனில் தடையின்றி ஒருங்கிணைக்கிறது.
தற்போதைய தொழில்நுட்பத்தின் சவால்கள் மற்றும் வரம்புகள்
WebXR லைட்டிங் மதிப்பீடு ஒரு மகத்தான பாய்ச்சலாக இருந்தாலும், அதன் தற்போதைய வரம்புகளைப் பற்றிய ஒரு யதார்த்தமான புரிதலுடன் அதை அணுகுவது அவசியம்.
- செயல்திறன் செலவு: கேமரா ஊட்டத்தை தொடர்ந்து பகுப்பாய்வு செய்வது, க்யூப்மேப்களை உருவாக்குவது மற்றும் கோள ஹார்மோனிக்ஸைச் செயலாக்குவது ஆகியவை குறிப்பிடத்தக்க CPU மற்றும் GPU ஆதாரங்களை நுகரும். இது ஒரு முக்கியமான செயல்திறன் கருத்தாகும், குறிப்பாக பேட்டரியில் இயங்கும் மொபைல் சாதனங்களில். டெவலப்பர்கள் சரியான யதார்த்தத்திற்கான விருப்பத்தை, மென்மையான, உயர்-பிரேம்-விகித அனுபவத்தின் தேவையுடன் சமநிலைப்படுத்த வேண்டும்.
- மதிப்பீட்டுத் துல்லியம்: பெயரே எல்லாவற்றையும் சொல்கிறது—இது ஒரு மதிப்பீடு. அசாதாரண லைட்டிங் நிலைமைகள், பல வண்ண விளக்குகள் கொண்ட மிகவும் சிக்கலான காட்சிகள், அல்லது ஒளியில் மிக விரைவான மாற்றங்கள் ஆகியவற்றால் கணினி ஏமாற்றப்படலாம். இது ஒரு நம்பத்தகுந்த தோராயத்தை வழங்குகிறது, ஒரு பௌதீக ரீதியாக சரியான அளவீட்டை அல்ல.
- சாதனம் மற்றும் உலாவி ஆதரவு: இந்த அம்சம் இன்னும் உலகளவில் கிடைக்கவில்லை. ARCore போன்ற தள-குறிப்பிட்ட AR கட்டமைப்புகளைச் சார்ந்திருப்பதால், இது முதன்மையாக Chrome இயங்கும் நவீன ஆண்ட்ராய்டு சாதனங்களில் கிடைக்கிறது. iOS சாதனங்களில் ஆதரவு என்பது பரவலான தத்தெடுப்புக்கு ஒரு பெரிய விடுபட்ட பகுதியாகும்.
- வெளிப்படையான நிழல்கள் இல்லை: தற்போதைய API சுற்றுப்புற மற்றும் பிரதிபலிப்பு ஒளிக்கு சிறந்தது, ஆனால் ஆதிக்கம் செலுத்தும் திசை ஒளி மூலங்களைப் பற்றிய தகவலை நேரடியாக வழங்காது. இதன் பொருள், "இந்த குறிப்பிட்ட திசையிலிருந்து ஒரு வலுவான ஒளி வருகிறது" என்று அது உங்களுக்குச் சொல்ல முடியாது. இதன் விளைவாக, மெய்நிகர் பொருட்களிலிருந்து நிஜ-உலக மேற்பரப்புகளில் கூர்மையான, துல்லியமான நிகழ்நேர நிழல்களை வீசுவதற்கு இன்னும் கூடுதல் நுட்பங்கள் தேவைப்படுகின்றன. டெவலப்பர்கள் பெரும்பாலும் பிரகாசமான ஒளியின் திசையை ஊகிக்க SH தரவைப் பயன்படுத்துகிறார்கள் மற்றும் தங்கள் காட்சியில் ஒரு நிலையான திசை ஒளியை வைக்கிறார்கள், ஆனால் இது ஒரு தோராயமே.
WebXR லைட்டிங்கின் எதிர்காலம்: அடுத்து என்ன?
நிகழ்நேர ரெண்டரிங் மற்றும் கணினி பார்வைத் துறை நம்பமுடியாத வேகத்தில் வளர்ந்து வருகிறது. அதிவேக இணையத்தில் லைட்டிங்கின் எதிர்காலம் பிரகாசமாக உள்ளது, பல அற்புதமான முன்னேற்றங்கள் அடிவானத்தில் உள்ளன.
மேம்படுத்தப்பட்ட திசை ஒளி மற்றும் நிழல் API-கள்
டெவலப்பர் சமூகத்திலிருந்து அடிக்கடி வரும் ஒரு கோரிக்கை, API ஆனது முதன்மை ஒளி மூல(ங்கள்) பற்றிய திசை, நிறம் மற்றும் தீவிரம் உள்ளிட்ட மேலும் வெளிப்படையான தரவை வழங்க வேண்டும் என்பதாகும். அத்தகைய API ஆனது பௌதீக ரீதியாக துல்லியமான, கூர்மையான விளிம்புகளுடன் கூடிய நிழல்களை வீசுவதை அற்பமாக்கும், இது யதார்த்தத்திற்கு ஒரு பெரிய பாய்ச்சலாக இருக்கும். நிஜ-உலகத் தளங்கள் மற்றும் மேஜைகளில் நிழல்களை வீச இது தளம் கண்டறிதல் API உடன் ஒருங்கிணைக்கப்படலாம்.
உயர்-தரமான சூழல் வரைபடங்கள்
மொபைல் செயலிகள் વધુ శక్తివంతమవుவதால், கணினி உயர்-தெளிவுத்திறன், உயர்-டைனமிக்-ரேஞ்ச் (HDR) பிரதிபலிப்பு க்யூப்மேப்களை உருவாக்கும் என்று நாம் எதிர்பார்க்கலாம். இது વધુ துடிப்பான மற்றும் விரிவான பிரதிபலிப்புகளுக்கு வழிவகுக்கும், இது உண்மையான மற்றும் மெய்நிகருக்கு இடையிலான கோட்டை மேலும் மங்கலாக்கும்.
பரந்த தள தத்தெடுப்பு
இறுதி இலக்கு, இந்த அம்சங்கள் அனைத்து முக்கிய உலாவிகள் மற்றும் சாதனங்களில் தரப்படுத்தப்பட்டு கிடைக்க வேண்டும் என்பதாகும். ஆப்பிள் அதன் AR சலுகைகளைத் தொடர்ந்து అభివృద్ధి చేస్తున్నதால், iOS-ல் உள்ள சஃபாரி இறுதியில் WebXR லைட்டிங் மதிப்பீட்டு API-ஐ ஏற்கும் என்ற நம்பிக்கை உள்ளது, இது இந்த உயர்-தரமான அனுபவங்களை மிகப் பெரிய உலகளாவிய பார்வையாளர்களுக்குக் கொண்டு வரும்.
AI-இயங்கும் காட்சி புரிதல்
மேலும் முன்னோக்கிப் பார்க்கையில், இயந்திரக் கற்றலில் ஏற்படும் முன்னேற்றங்கள், சாதனங்கள் ஒளியை மதிப்பிடுவது மட்டுமல்லாமல், ஒரு காட்சியை சொற்பொருள் ரீதியாகப் புரிந்துகொள்ளவும் அனுமதிக்கும். சாதனம் ஒரு "ஜன்னல்", ஒரு "விளக்கு", அல்லது "வானம்" ஆகியவற்றை அடையாளம் கண்டு, அந்த அறிவைப் பயன்படுத்தி இன்னும் துல்லியமான மற்றும் வலுவான லைட்டிங் மாதிரியை உருவாக்கலாம், இது பல ஒளி மூலங்கள் மற்றும் சிக்கலான நிழல் தொடர்புகளுடன் முழுமையடைகிறது.
முடிவுரை: அதிவேக இணையத்திற்கான வழியை ஒளிரூட்டுதல்
WebXR லைட்டிங் மதிப்பீடு என்பது ஒரு அதிகரிக்கும் அம்சம் மட்டுமல்ல; இது இணையத்தில் ஆக்மென்டட் ரியாலிட்டியின் எதிர்காலத்திற்கான ஒரு அடித்தள தொழில்நுட்பமாகும். டிஜிட்டல் பொருட்களை அவற்றின் பௌதீகச் சூழல்களால் யதார்த்தமாக ஒளிரூட்ட அனுமதிப்பதன் மூலம், இது AR-ஐ ஒரு புதுமையான வித்தையிலிருந்து உண்மையிலேயே அதிவேகமான மற்றும் நம்பகமான ஊடகமாக உயர்த்துகிறது.
இது AR அனுபவங்களை அடிக்கடி தொடர்பில்லாததாக உணரவைக்கும் புலனுணர்வு இடைவெளியை மூடுகிறது. இ-காமர்ஸுக்கு, ஒரு வாடிக்கையாளர் ஒரு உலோக விளக்கு தங்கள் வீட்டில் உள்ள ஒளியை உண்மையில் எவ்வாறு பிரதிபலிக்கும் என்பதைப் பார்க்க முடியும். கேமிங்கிற்கு, கதாபாத்திரங்கள் வீரரின் உலகில் அதிக பிரசன்னத்துடனும் ஒருங்கிணைக்கப்பட்டதாகவும் உணர்கின்றன. கல்விக்கு, வரலாற்று கலைப்பொருட்களை ஒரு வலை உலாவியில் முன்பு சாத்தியமில்லாத யதார்த்தத்துடன் பார்க்க முடியும்.
செயல்திறன் மற்றும் குறுக்கு-தள ஆதரவில் சவால்கள் இருந்தாலும், இன்று கிடைக்கும் கருவிகள், குறிப்பாக Three.js மற்றும் Babylon.js போன்ற சக்திவாய்ந்த நூலகங்களுடன் இணைந்தால், இந்த ஒரு காலத்தில் சிக்கலான தொழில்நுட்பத்தை குறிப்பிடத்தக்க வகையில் அணுகக்கூடியதாக மாற்றியுள்ளன. அதிவேக இணையத்தில் ஆர்வமுள்ள அனைத்து வலை டெவலப்பர்களையும் படைப்பாளர்களையும் WebXR லைட்டிங் மதிப்பீட்டு API-ஐ ஆராய நாங்கள் ஊக்குவிக்கிறோம். பரிசோதனை செய்யத் தொடங்குங்கள், எல்லைகளைத் தள்ளுங்கள், மற்றும் உலகளாவிய பார்வையாளர்களுக்கான அடுத்த தலைமுறை யதார்த்தமான AR அனுபவங்களுக்கு வழிகாட்ட உதவுங்கள்.