\n Uzman \u0130pucu: Blender’da modellerinizi optimize ederken “Decimate Modifier” kullanarak poligon say\u0131s\u0131n\u0131 d\u00fc\u015f\u00fcrebilirsiniz. Bu, web performans\u0131 i\u00e7in \u00e7ok \u00f6nemlidir. Ayr\u0131ca, t\u00fcm dokular\u0131 birle\u015ftirerek (atlaslama) ve \u00e7\u00f6z\u00fcn\u00fcrl\u00fcklerini d\u00fc\u015f\u00fcrerek dosya boyutunu daha da k\u00fc\u00e7\u00fcltebilirsiniz.\n <\/div>\n
Web’e Ta\u015f\u0131ma: Three.js ile 3D Ortam\u0131 Nas\u0131l Canland\u0131r\u0131r\u0131z?<\/h3>\n
Modellerimizi haz\u0131rlad\u0131\u011f\u0131m\u0131za g\u00f6re, \u015fimdi s\u0131ra onlar\u0131 web taray\u0131c\u0131s\u0131nda interaktif bir sahneye d\u00f6n\u00fc\u015ft\u00fcrmekte. Bu b\u00f6l\u00fcmde, JavaScript k\u00fct\u00fcphanesi Three.js kullanarak temel bir 3D sahne kurulumunu ve GLTF modelimizi nas\u0131l y\u00fckleyece\u011fimizi ele alaca\u011f\u0131z.<\/p>\n
\u00d6ncelikle, projemiz i\u00e7in basit bir HTML dosyas\u0131 ve JavaScript dosyas\u0131 olu\u015ftural\u0131m. HTML dosyam\u0131z, Three.js k\u00fct\u00fcphanesini ve kendi JavaScript kodumuzu i\u00e7erecek, ayr\u0131ca 3D sahnesini g\u00f6sterece\u011fimiz bir canvas<\/code> elementi bulunduracak. Basit bir index.html<\/code> dosyas\u0131 \u015f\u00f6yle g\u00f6r\u00fcnebilir:<\/p>\n\n\n\n\n \n \n Sanal Portf\u00f6y Odas\u0131<\/title>\n <style>\n body { margin: 0; overflow: hidden; }\n canvas { display: block; }\n <\/style>\n<\/head>\n<body>\n <script type=\"module\" src=\".\/main.js\"><\/script>\n<\/body>\n<\/html>\n <\/pre>\n<p><\/code><\/p>\n<p>\u015eimdi <code>main.js<\/code> dosyam\u0131z\u0131 olu\u015ftural\u0131m. Three.js'i kullanmak i\u00e7in NPM arac\u0131l\u0131\u011f\u0131yla veya CDN'den import edebiliriz. Mod\u00fcler bir yap\u0131 i\u00e7in genellikle NPM tercih edilir. Proje dizininizde bir terminal a\u00e7\u0131p \u015fu komutlar\u0131 \u00e7al\u0131\u015ft\u0131r\u0131n:<\/p>\n<pre><code>\nnpm init -y\nnpm install three\n <\/pre>\n<p><\/code><\/p>\n<p>Ard\u0131ndan <code>main.js<\/code> dosyam\u0131za temel Three.js kurulumunu yapal\u0131m:<\/p>\n<pre><code>\nimport * as THREE from 'three';\nimport { OrbitControls } from 'three\/examples\/jsm\/controls\/OrbitControls.js';\nimport { GLTFLoader } from 'three\/examples\/jsm\/loaders\/GLTFLoader.js';\n\n\/\/ 1. Sahne, Kamera, Renderer olu\u015fturma\nconst scene = new THREE.Scene();\nconst camera = new THREE.PerspectiveCamera(75, window.innerWidth \/ window.innerHeight, 0.1, 1000);\nconst renderer = new THREE.WebGLRenderer({ antialias: true });\nrenderer.setSize(window.innerWidth, window.innerHeight);\nrenderer.setClearColor(0xcccccc); \/\/ Sahne arka plan rengi\ndocument.body.appendChild(renderer.domElement);\n\n\/\/ Kamera pozisyonu\ncamera.position.set(0, 2, 5); \/\/ x, y, z koordinatlar\u0131\n\n\/\/ 2. I\u015f\u0131kland\u0131rma ekleme\nconst ambientLight = new THREE.AmbientLight(0xffffff, 0.7); \/\/ Ortam \u0131\u015f\u0131\u011f\u0131\nscene.add(ambientLight);\n\nconst directionalLight = new THREE.DirectionalLight(0xffffff, 0.8); \/\/ Y\u00f6nl\u00fc \u0131\u015f\u0131k\ndirectionalLight.position.set(5, 10, 5).normalize();\nscene.add(directionalLight);\n\n\/\/ 3. GLTF Modelini Y\u00fckleme\nconst loader = new GLTFLoader();\nloader.load(\n '.\/portfoy_odasi.glb', \/\/ Blender'dan d\u0131\u015fa aktard\u0131\u011f\u0131n\u0131z dosyan\u0131n yolu\n function (gltf) {\n scene.add(gltf.scene);\n console.log('Model ba\u015far\u0131yla y\u00fcklendi!');\n },\n undefined, \/\/ \u0130lerleme fonksiyonu (iste\u011fe ba\u011fl\u0131)\n function (error) {\n console.error('Model y\u00fcklenirken bir hata olu\u015ftu:', error);\n }\n);\n\n\/\/ 4. Kullan\u0131c\u0131 etkile\u015fimleri i\u00e7in OrbitControls (kameray\u0131 d\u00f6nd\u00fcrme)\nconst controls = new OrbitControls(camera, renderer.domElement);\ncontrols.enableDamping = true; \/\/ Daha ak\u0131c\u0131 hareket\ncontrols.dampingFactor = 0.25;\n\n\/\/ 5. Animasyon d\u00f6ng\u00fcs\u00fc\nfunction animate() {\n requestAnimationFrame(animate);\n controls.update(); \/\/ OrbitControls'u g\u00fcncelle\n renderer.render(scene, camera);\n}\nanimate();\n\n\/\/ 6. Pencere boyutland\u0131rma olay\u0131na tepki verme\nwindow.addEventListener('resize', () => {\n camera.aspect = window.innerWidth \/ window.innerHeight;\n camera.updateProjectionMatrix();\n renderer.setSize(window.innerWidth, window.innerHeight);\n});\n <\/pre>\n<p><\/code><\/p>\n<p>Yukar\u0131daki kod blo\u011fu, temel bir Three.js sahnesi olu\u015fturur. Bir sahne, bir kamera ve bir renderer tan\u0131mlar. Sahneye hem bir ortam \u0131\u015f\u0131\u011f\u0131 (AmbientLight) hem de y\u00f6nl\u00fc bir \u0131\u015f\u0131k (DirectionalLight) ekleyerek modellerinizin g\u00f6r\u00fcn\u00fcr olmas\u0131n\u0131 sa\u011flar\u0131z. Daha sonra, <code>GLTFLoader<\/code> kullanarak Blender'dan d\u0131\u015fa aktard\u0131\u011f\u0131m\u0131z <code>portfoy_odasi.glb<\/code> dosyas\u0131n\u0131 sahneye ekleriz. Son olarak, kullan\u0131c\u0131lar\u0131n fare ile sahneyi d\u00f6nd\u00fcrebilmesi ve yak\u0131nla\u015ft\u0131r\u0131p uzakla\u015ft\u0131rabilmesi i\u00e7in <code>OrbitControls<\/code> ekleriz. <code>animate<\/code> fonksiyonu ise, her karede sahnenin yeniden \u00e7izilmesini sa\u011flayan ve animasyonlar\u0131 m\u00fcmk\u00fcn k\u0131lan ana d\u00f6ng\u00fcd\u00fcr. Bu temel kurulum ile sanal portf\u00f6y odan\u0131z\u0131n iskeleti olu\u015fmu\u015f olur, ve Blender'da tasarlad\u0131\u011f\u0131n\u0131z oda web taray\u0131c\u0131n\u0131zda g\u00f6r\u00fcnt\u00fclenmeye ba\u015flar. Bu, interaktif deneyimler i\u00e7in sa\u011flam bir temel olu\u015fturur.<\/p>\n<h3>\u0130nteraktif Elementler ve Kullan\u0131c\u0131 Deneyimi Nas\u0131l Geli\u015ftirilir?<\/h3>\n<p>3D sanal portf\u00f6y odan\u0131z\u0131n sadece g\u00f6rsel olarak \u00e7ekici olmas\u0131 yeterli de\u011fildir; ayn\u0131 zamanda kullan\u0131c\u0131lar\u0131n projelerinizle etkile\u015fim kurabilece\u011fi, bilgi edinebilece\u011fi ve odan\u0131zda kolayca gezinebilece\u011fi bir deneyim sunmal\u0131d\u0131r. Bu b\u00f6l\u00fcmde, interaktif elementler ekleyerek kullan\u0131c\u0131 deneyimini nas\u0131l zenginle\u015ftirebilece\u011finizi ele alaca\u011f\u0131z.<\/p>\n<h4>Hotspotlar ve Bilgi Panelleri Ekleme<\/h4>\n<p>Projelerinizi sergilemenin en etkili yollar\u0131ndan biri, odan\u0131zdaki belirli objelerin \u00fczerine \"hotspotlar\" yerle\u015ftirmektir. Bu hotspotlar, kullan\u0131c\u0131 t\u0131klad\u0131\u011f\u0131nda bir projenin detaylar\u0131n\u0131 g\u00f6steren bir bilgi paneli a\u00e7abilir. Bunu uygulamak i\u00e7in, Three.js'in <code>Raycaster<\/code> s\u0131n\u0131f\u0131n\u0131 kullanabiliriz. <code>Raycaster<\/code>, kameradan farenin i\u015faret etti\u011fi noktaya bir \u0131\u015f\u0131n g\u00f6ndererek hangi 3D objenin t\u0131kland\u0131\u011f\u0131n\u0131 tespit etmemizi sa\u011flar.<\/p>\n<pre><code>\n\/\/ main.js dosyan\u0131zda\nconst raycaster = new THREE.Raycaster();\nconst mouse = new THREE.Vector2();\n\nfunction onMouseMove(event) {\n \/\/ Fare koordinatlar\u0131n\u0131 Three.js'in bekledi\u011fi formatta normalize et\n mouse.x = (event.clientX \/ window.innerWidth) * 2 - 1;\n mouse.y = -(event.clientY \/ window.innerHeight) * 2 + 1;\n}\n\nfunction onClick(event) {\n \/\/ Raycaster'\u0131 g\u00fcncelle ve sahnedeki objelerle kesi\u015fimi kontrol et\n raycaster.setFromCamera(mouse, camera);\n const intersects = raycaster.intersectObjects(scene.children, true); \/\/ true ile i\u00e7 i\u00e7e objeleri de kontrol et\n\n if (intersects.length > 0) {\n const firstIntersectedObject = intersects[0].object;\n console.log('T\u0131klanan obje:', firstIntersectedObject.name);\n\n \/\/ \u00d6rnek: T\u0131klanan objeye g\u00f6re bilgi paneli a\u00e7\n if (firstIntersectedObject.name === 'Proje_Panel_1') { \/\/ Blender'da verdi\u011finiz obje ismi\n displayProjectInfo('Proje 1: Sanal Galeri Uygulamas\u0131', 'Bu proje, sanat eserlerini dijital ortamda sergilemek i\u00e7in geli\u015ftirilmi\u015ftir.');\n } else if (firstIntersectedObject.name === 'Proje_Panel_2') {\n displayProjectInfo('Proje 2: Etkile\u015fimli \u00dcr\u00fcn G\u00f6sterimi', 'M\u00fc\u015fterilerin \u00fcr\u00fcnleri 360 derece inceleyebildi\u011fi bir demo.');\n }\n \/\/ ... di\u011fer objeler i\u00e7in if\/else bloklar\u0131\n }\n}\n\n\/\/ Bilgi paneli olu\u015fturma fonksiyonu (HTML\/CSS ile daha \u015f\u0131k hale getirilebilir)\nfunction displayProjectInfo(title, description) {\n let infoPanel = document.getElementById('infoPanel');\n if (!infoPanel) {\n infoPanel = document.createElement('div');\n infoPanel.id = 'infoPanel';\n infoPanel.style.position = 'absolute';\n infoPanel.style.top = '20px';\n infoPanel.style.left = '20px';\n infoPanel.style.backgroundColor = 'rgba(0,0,0,0.7)';\n infoPanel.style.color = 'white';\n infoPanel.style.padding = '15px';\n infoPanel.style.borderRadius = '8px';\n infoPanel.style.zIndex = '100';\n infoPanel.style.maxWidth = '300px';\n document.body.appendChild(infoPanel);\n }\n infoPanel.innerHTML = <code><h3>${title}<\/h3><p>${description}<\/p><button onclick=\"document.getElementById('infoPanel').style.display='none'\">Kapat<\/button><\/code>;\n infoPanel.style.display = 'block';\n}\n\nwindow.addEventListener('mousemove', onMouseMove, false);\nwindow.addEventListener('click', onClick, false);\n <\/pre>\n<p><\/code><\/p>\n<p>Bu kod par\u00e7ac\u0131\u011f\u0131, fare hareketlerini izler ve t\u0131klama olay\u0131nda hangi 3D objenin se\u00e7ildi\u011fini tespit eder. Ard\u0131ndan, objenin ad\u0131na g\u00f6re ilgili proje bilgisini i\u00e7eren basit bir HTML paneli (<code>displayProjectInfo<\/code> fonksiyonu ile) g\u00f6sterir. Blender'da modelleme yaparken objelerinize anlaml\u0131 isimler vermek (\u00f6rn. \"Proje_Panel_1\") bu a\u015famada i\u015finizi kolayla\u015ft\u0131racakt\u0131r.<\/p>\n<h4>Navigasyon ve Kamera Turlar\u0131<\/h4>\n<p>Kullan\u0131c\u0131lar\u0131n odan\u0131zda serbest\u00e7e dola\u015fmas\u0131n\u0131 sa\u011flamak veya \u00f6nceden belirlenmi\u015f bir \"tur\" rotas\u0131n\u0131 izlemesini sa\u011flamak, kullan\u0131c\u0131 deneyimini art\u0131r\u0131r. <code>OrbitControls<\/code> serbest kamera hareketine izin verirken, belirli noktalara \"teleportasyon\" veya otomatik kamera turlar\u0131 ekleyerek daha y\u00f6nlendirilmi\u015f bir deneyim sunabilirsiniz. \u00d6rne\u011fin, odan\u0131z\u0131n farkl\u0131 b\u00f6lgeleri i\u00e7in belirli kamera pozisyonlar\u0131 ve bak\u0131\u015f a\u00e7\u0131lar\u0131 (<code>THREE.Vector3<\/code> ve <code>THREE.Vector3<\/code>) tan\u0131mlayabilir ve bir UI d\u00fc\u011fmesine bas\u0131ld\u0131\u011f\u0131nda kameran\u0131n o konuma yumu\u015fak bir \u015fekilde hareket etmesini sa\u011flayabilirsiniz. Tween.js gibi k\u00fct\u00fcphaneler, kamera animasyonlar\u0131 i\u00e7in harika bir se\u00e7enektir.<\/p>\n<pre><code>\n\/\/ main.js dosyan\u0131zda\n\/\/ ...\nimport { TWEEN } from 'three\/examples\/jsm\/libs\/tween.module.min.js';\n\n\/\/ Farkl\u0131 kamera pozisyonlar\u0131 tan\u0131mla\nconst cameraPositions = {\n entrance: { pos: new THREE.Vector3(0, 2, 5), target: new THREE.Vector3(0, 1, 0) },\n projectArea1: { pos: new THREE.Vector3(-4, 1.5, 0), target: new THREE.Vector3(-2, 1, 0) },\n projectArea2: { pos: new THREE.Vector3(4, 1.5, 0), target: new THREE.Vector3(2, 1, 0) }\n};\n\n\/\/ Belirli bir noktaya \u0131\u015f\u0131nlanma fonksiyonu\nfunction goToPosition(positionKey) {\n const targetPosition = cameraPositions[positionKey].pos;\n const targetLookAt = cameraPositions[positionKey].target;\n\n new TWEEN.Tween(camera.position)\n .to({ x: targetPosition.x, y: targetPosition.y, z: targetPosition.z }, 1000) \/\/ 1 saniyede hareket\n .easing(TWEEN.Easing.Quadratic.Out)\n .start();\n\n \/\/ Kameran\u0131n bak\u0131\u015f a\u00e7\u0131s\u0131n\u0131 da hedefle (OrbitControls kullan\u0131yorsan\u0131z daha karma\u015f\u0131k olabilir)\n \/\/ Ya da OrbitControls'un target'\u0131n\u0131 da animasyonla de\u011fi\u015ftirebilirsiniz.\n new TWEEN.Tween(controls.target)\n .to({ x: targetLookAt.x, y: targetLookAt.y, z: targetLookAt.z }, 1000)\n .easing(TWEEN.Easing.Quadratic.Out)\n .onUpdate(() => controls.update()) \/\/ Kontrolleri her ad\u0131mda g\u00fcncelle\n .start();\n}\n\n\/\/ UI elementleri ekleyelim (\u00f6rnek HTML)\n\/\/ <div style=\"position:absolute; bottom:20px; left:20px; z-index:100;\">\n\/\/ <button onclick=\"goToPosition('entrance')\">Giri\u015f<\/button>\n\/\/ <button onclick=\"goToPosition('projectArea1')\">Proje Alan\u0131 1<\/button>\n\/\/ <\/div>\n\n\/\/ Animasyon d\u00f6ng\u00fcs\u00fcnde TWEEN'i g\u00fcncelle\nfunction animate() {\n requestAnimationFrame(animate);\n controls.update();\n TWEEN.update(); \/\/ Tween animasyonlar\u0131n\u0131 g\u00fcncelle\n renderer.render(scene, camera);\n}\n\/\/ ...\n <\/pre>\n<p><\/code><\/p>\n<p>Bu \u00f6rnek, belirli bir butona t\u0131kland\u0131\u011f\u0131nda kameran\u0131n yumu\u015fak bir animasyonla \u00f6nceden tan\u0131mlanm\u0131\u015f bir konuma gitmesini sa\u011flar. Bu, kullan\u0131c\u0131lar\u0131n odan\u0131z\u0131n farkl\u0131 b\u00f6l\u00fcmlerine h\u0131zla ge\u00e7i\u015f yapmas\u0131na olanak tan\u0131r ve navigasyonu kolayla\u015ft\u0131r\u0131r.<\/p>\n<h4>Geli\u015fmi\u015f Etkile\u015fimler: Video ve Ses Entegrasyonu<\/h4>\n<p>Sanal portf\u00f6y odan\u0131zda sadece g\u00f6rseller de\u011fil, videolar ve sesler de sergileyebilirsiniz. Three.js, video dokular\u0131 ve 3D uzamsal sesler i\u00e7in destek sunar. \u00d6rne\u011fin, bir proje panelinin \u00fczerine t\u0131kland\u0131\u011f\u0131nda bir tan\u0131t\u0131m videosunu oynatabilir veya bir objeye yakla\u015f\u0131ld\u0131\u011f\u0131nda o objeyle ilgili bir ses dosyas\u0131n\u0131 \u00e7alabilirsiniz. Video dokular\u0131 i\u00e7in, bir HTML <code><video><\/code> elementini olu\u015fturup bunu Three.js <code>VideoTexture<\/code> olarak kullanabilir ve bir 3D y\u00fczeye uygulayabilirsiniz. Uzamsal ses i\u00e7in ise <code>PositionalAudio<\/code> ve <code>AudioListener<\/code> kullanarak sesin 3D uzaydaki konumuna g\u00f6re de\u011fi\u015fen bir ses deneyimi sunabilirsiniz. Bu t\u00fcr interaktif elementler, portf\u00f6y odan\u0131z\u0131n s\u00fcr\u00fckleyicili\u011fini art\u0131r\u0131r ve ziyaret\u00e7ilerinize \u00e7ok boyutlu bir deneyim sunar. B\u00f6ylece projelerinizin sadece g\u00f6rsel de\u011fil, i\u015fitsel y\u00f6nlerini de vurgulayabilir, hatta projelerinize \u00f6zel bir m\u00fczik veya atmosferik sesler ekleyerek genel havay\u0131 zenginle\u015ftirebilirsiniz.<\/p>\n<h3>Performans Optimizasyonu ve Mobil Uyumluluk \u0130pu\u00e7lar\u0131 Nelerdir?<\/h3>\n<p>3D sanal portf\u00f6y odan\u0131z\u0131n hem masa\u00fcst\u00fc hem de mobil cihazlarda sorunsuz bir \u015fekilde \u00e7al\u0131\u015fmas\u0131, kullan\u0131c\u0131 deneyimi a\u00e7\u0131s\u0131ndan kritik \u00f6neme sahiptir. Y\u00fcksek poligonlu modeller, karma\u015f\u0131k \u0131\u015f\u0131kland\u0131rmalar ve \u00e7ok say\u0131da etkile\u015fimli element, performans\u0131 olumsuz etkileyebilir. Bu b\u00f6l\u00fcmde, projenizi optimize etmek ve mobil cihazlar i\u00e7in uyumlu hale getirmek i\u00e7in baz\u0131 \u00f6nemli ipu\u00e7lar\u0131n\u0131 ele alaca\u011f\u0131z.<\/p>\n<h4>Model Optimizasyonu<\/h4>\n<p>3D modelleriniz, performans\u0131 en \u00e7ok etkileyen fakt\u00f6rlerden biridir. Unutmay\u0131n, her bir poligon (\u00fc\u00e7gen veya d\u00f6rtgen) GPU taraf\u0131ndan i\u015flenmek zorundad\u0131r. Bu nedenle:<\/p>\n<ul>\n<li><strong>Poligon Say\u0131s\u0131n\u0131 Azalt\u0131n:<\/strong> Gereksiz detaylar\u0131 ortadan kald\u0131rarak veya Blender gibi 3D yaz\u0131l\u0131mlardaki \"Decimate\" gibi ara\u00e7lar\u0131 kullanarak modellerinizin poligon say\u0131s\u0131n\u0131 m\u00fcmk\u00fcn oldu\u011funca d\u00fc\u015f\u00fcr\u00fcn. Yak\u0131n mesafeden g\u00f6r\u00fcnmeyecek objeler i\u00e7in daha az detay kullan\u0131n.<\/li>\n<li><strong>Doku S\u0131k\u0131\u015ft\u0131rma:<\/strong> Y\u00fcksek \u00e7\u00f6z\u00fcn\u00fcrl\u00fckl\u00fc dokular, \u00f6nemli miktarda bellek t\u00fcketebilir ve y\u00fckleme s\u00fcrelerini uzatabilir. Dokular\u0131n\u0131z\u0131 WebP, JPG veya PNG formatlar\u0131nda kaliteyi \u00e7ok d\u00fc\u015f\u00fcrmeden optimize edin. Ayr\u0131ca, birden fazla k\u00fc\u00e7\u00fck dokuyu tek bir \"atlas\" dokuda birle\u015ftirerek \u00e7izim \u00e7a\u011fr\u0131s\u0131 (draw call) say\u0131s\u0131n\u0131 azalt\u0131n.<\/li>\n<li><strong>Geometriyi Birle\u015ftirme:<\/strong> Benzer materyallere sahip birden fazla k\u00fc\u00e7\u00fck objeyi tek bir b\u00fcy\u00fck objede birle\u015ftirin. Bu, GPU'nun daha az \"\u00e7izim \u00e7a\u011fr\u0131s\u0131\" yapmas\u0131n\u0131 sa\u011flayarak performans\u0131 art\u0131r\u0131r.<\/li>\n<li><strong>UV Haritalama Optimizasyonu:<\/strong> Dokular\u0131n UV haritalar\u0131n\u0131n \u00fcst \u00fcste binmedi\u011finden ve gereksiz bo\u015fluklar i\u00e7ermedi\u011finden emin olun. Verimli UV kullan\u0131m\u0131, doku bellek kullan\u0131m\u0131n\u0131 azalt\u0131r.<\/li>\n<\/ul>\n<h4>Kod Optimizasyonu ve Y\u00fckleme Stratejileri<\/h4>\n<p>Sadece modeller de\u011fil, JavaScript kodunuz ve genel y\u00fckleme stratejiniz de performans\u0131 etkiler:<\/p>\n<ul>\n<li><strong>Bellek Y\u00f6netimi:<\/strong> Three.js objeleri (geometri, materyal, doku) bellekte yer kaplar. Bir objeyi sahneden kald\u0131rd\u0131\u011f\u0131n\u0131zda, <code>dispose()<\/code> metodunu \u00e7a\u011f\u0131rarak GPU belle\u011finden de temizledi\u011finizden emin olun, aksi takdirde bellek s\u0131z\u0131nt\u0131lar\u0131 ya\u015fanabilir.<\/li>\n<li><strong>Lazy Loading (Tembel Y\u00fckleme):<\/strong> T\u00fcm modelleri ve dokular\u0131 sayfa y\u00fcklenir y\u00fcklenmez y\u00fcklemek yerine, sadece ba\u015flang\u0131\u00e7ta g\u00f6r\u00fcnenleri y\u00fckleyin. Kullan\u0131c\u0131 odan\u0131n farkl\u0131 bir b\u00f6l\u00fcm\u00fcne ge\u00e7ti\u011finde veya belirli bir projeye t\u0131klad\u0131\u011f\u0131nda ilgili modelleri dinamik olarak y\u00fckleyin. Bu, ilk y\u00fckleme s\u00fcresini \u00f6nemli \u00f6l\u00e7\u00fcde k\u0131salt\u0131r.<\/li>\n<li><strong>Model Streaming:<\/strong> \u00c7ok b\u00fcy\u00fck modeller i\u00e7in, modelin tamam\u0131 yerine sadece g\u00f6r\u00fcn\u00fcr k\u0131s\u0131mlar\u0131n\u0131 y\u00fcklemeyi d\u00fc\u015f\u00fcnebilirsiniz.<\/li>\n<li><strong>Render D\u00f6ng\u00fcs\u00fc Optimizasyonu:<\/strong> <code>animate()<\/code> fonksiyonunuzun i\u00e7inde gereksiz hesaplamalardan ka\u00e7\u0131n\u0131n. Sadece de\u011fi\u015fen objeleri g\u00fcncelleyin veya belirli durumlarda kare h\u0131z\u0131n\u0131 d\u00fc\u015f\u00fcr\u00fcn.<\/li>\n<\/ul>\n<h4>Mobil Uyumluluk \u0130\u00e7in Ek \u0130pu\u00e7lar\u0131<\/h4>\n<p>Mobil cihazlar genellikle daha az i\u015flem g\u00fcc\u00fcne ve daha k\u00fc\u00e7\u00fck ekranlara sahiptir. Bu nedenle \u00f6zel optimizasyonlar gerekir:<\/p>\n<ul>\n<li><strong>Duyarl\u0131 Tasar\u0131m (Responsive Design):<\/strong> Three.js sahnenizin ve di\u011fer HTML\/CSS UI elementlerinizin farkl\u0131 ekran boyutlar\u0131na uyum sa\u011flamas\u0131 i\u00e7in CSS Media Query'leri kullan\u0131n.<\/li>\n<li><strong>Medya Sorgusu \u00d6rne\u011fi (CSS):<\/strong>\n<pre><code>\n@media (max-width: 768px) {\n \/* Telefonlar ve tabletler i\u00e7in ge\u00e7erli stil ayarlar\u0131 *\/\n body {\n font-size: 14px;\n }\n .info-panel {\n width: 90% !important; \/* Mobil i\u00e7in paneli geni\u015flet *\/\n left: 5% !important;\n right: 5% !important;\n }\n \/* Three.js canvas'\u0131n\u0131n da boyutu ayarlanabilir *\/\n}\n\n@media (min-width: 769px) and (max-width: 1024px) {\n \/* Tabletler ve k\u00fc\u00e7\u00fck diz\u00fcst\u00fc bilgisayarlar i\u00e7in ge\u00e7erli stil ayarlar\u0131 *\/\n body {\n font-size: 16px;\n }\n}\n <\/pre>\n<p><\/code>\n <\/li>\n<li><strong>Dokunmatik Etkile\u015fimler:<\/strong> Fare etkile\u015fimlerine ek olarak, dokunmatik ekranlar i\u00e7in \u00f6zel kontroller (\u00f6rne\u011fin, parmakla d\u00f6nd\u00fcrme, \u00e7imdikleyerek yak\u0131nla\u015ft\u0131rma) uygulay\u0131n. Three.js'in <code>OrbitControls<\/code> ve di\u011fer kontrolleri genellikle dokunmatik deste\u011fi de i\u00e7erir.<\/li>\n<li><strong>D\u00fc\u015f\u00fck Kalite Modu:<\/strong> Mobil cihazlarda performans\u0131 art\u0131rmak i\u00e7in otomatik olarak daha d\u00fc\u015f\u00fck \u00e7\u00f6z\u00fcn\u00fcrl\u00fckl\u00fc dokular\u0131 y\u00fckleyin veya daha basit bir \u0131\u015f\u0131kland\u0131rma modeli kullan\u0131n. Mobil cihazlarda WebGLRenderer'\u0131n <code>pixelRatio<\/code>'sunu d\u00fc\u015f\u00fcrerek de render kalitesini d\u00fc\u015f\u00fcr\u00fcp performans\u0131 art\u0131rabilirsiniz (<code>renderer.setPixelRatio(window.devicePixelRatio \/ 2)<\/code> gibi).<\/li>\n<li><strong>Web Workers:<\/strong> A\u011f\u0131r hesaplamalar\u0131 (\u00f6rne\u011fin model y\u00fckleme veya karma\u015f\u0131k animasyon hesaplamalar\u0131) ana i\u015f par\u00e7ac\u0131\u011f\u0131ndan ay\u0131rarak kullan\u0131c\u0131 aray\u00fcz\u00fcn\u00fcn donmas\u0131n\u0131 engelleyin.<\/li>\n<\/ul>\n<p>Bu optimizasyon tekniklerini uygulayarak, 3D sanal portf\u00f6y odan\u0131z\u0131n \u00e7ok \u00e7e\u015fitli cihazlarda h\u0131zl\u0131 ve ak\u0131c\u0131 bir deneyim sunmas\u0131n\u0131 sa\u011flayabilirsiniz. Performans, kullan\u0131c\u0131lar\u0131n sitenizde kalma s\u00fcresini do\u011frudan etkileyen \u00f6nemli bir fakt\u00f6rd\u00fcr.<\/p>\n<h2>Ger\u00e7ek D\u00fcnya Senaryolar\u0131: Ba\u015far\u0131l\u0131 3D Sanal Portf\u00f6y Odas\u0131 \u00d6rnekleri<\/h2>\n<p>Teorik bilgileri peki\u015ftirmek ve ilham almak i\u00e7in, 3D sanal portf\u00f6y odalar\u0131n\u0131n \u00e7e\u015fitli sekt\u00f6rlerde nas\u0131l kullan\u0131labilece\u011fine dair ger\u00e7ek d\u00fcnya senaryolar\u0131na g\u00f6z atal\u0131m. Bu \u00f6rnekler, teknolojinin yarat\u0131c\u0131 potansiyelini ve farkl\u0131 ihtiya\u00e7lara nas\u0131l uyarlanabilece\u011fini g\u00f6stermektedir.<\/p>\n<h3>Vaka Analizi 1: Bir Mimar\u0131n Sanal Proje Gezi Odas\u0131<\/h3>\n<p>Geleneksel mimarl\u0131k sunumlar\u0131 genellikle 2D \u00e7izimler, render g\u00f6rselleri ve maketlerle yap\u0131l\u0131r. Ancak bir 3D sanal portf\u00f6y odas\u0131, mimarlar i\u00e7in oyun de\u011fi\u015ftirici bir unsur olabilir. \u00d6rne\u011fin, \"ArchViz Studio\" adl\u0131 bir mimarl\u0131k firmas\u0131, yeni konut projelerini potansiyel al\u0131c\u0131lara sunmak i\u00e7in interaktif bir sanal oda geli\u015ftirdi. Bu odada:<\/p>\n<ul>\n<li>Kullan\u0131c\u0131lar, mimari modelin i\u00e7ine girerek odadan odaya dola\u015fabiliyor, hatta farkl\u0131 katlara \u00e7\u0131kabiliyorlard\u0131.<\/li>\n<li>Duvarlarda, projenin farkl\u0131 a\u015famalar\u0131n\u0131 g\u00f6steren (taslaklar, teknik \u00e7izimler) interaktif paneller vard\u0131.<\/li>\n<li>Mobilyalara veya i\u00e7 mekan objelerine t\u0131klayarak, kullan\u0131lan materyaller (ah\u015fap, mermer, kuma\u015f) hakk\u0131nda detayl\u0131 bilgilere ula\u015f\u0131labiliyordu. Hatta baz\u0131 objelerin rengini veya dokusunu de\u011fi\u015ftirmeye y\u00f6nelik basit ki\u015fiselle\u015ftirme se\u00e7enekleri bile sunuluyordu.<\/li>\n<li>Pencereye yakla\u015f\u0131ld\u0131\u011f\u0131nda, projenin yap\u0131laca\u011f\u0131 b\u00f6lgenin sanal bir g\u00f6r\u00fcnt\u00fcs\u00fc beliriyordu, b\u00f6ylece kullan\u0131c\u0131lar d\u0131\u015far\u0131daki manzaray\u0131 da deneyimleyebiliyordu.<\/li>\n<\/ul>\n<p>Bu yakla\u015f\u0131m, potansiyel m\u00fc\u015fterilerin projenin boyutlar\u0131n\u0131, atmosferini ve i\u015flevselli\u011fini \u00e7ok daha iyi anlamas\u0131n\u0131 sa\u011flad\u0131. Hatta baz\u0131 m\u00fc\u015fteriler, bu sanal gezi sayesinde projeye daha duygusal bir ba\u011f kurduklar\u0131n\u0131 ve sat\u0131n alma kararlar\u0131n\u0131 olumlu y\u00f6nde etkiledi\u011fini belirtti. ArchViz Studio, bu sayede hem sat\u0131\u015f oranlar\u0131n\u0131 art\u0131rd\u0131 hem de rakipleri aras\u0131nda yenilik\u00e7i bir konum elde etti.<\/p>\n<h3>Vaka Analizi 2: Bir Oyun Geli\u015ftiricisinin Etkile\u015fimli St\u00fcdyosu<\/h3>\n<p>\"PixelForge Games\" ad\u0131nda ba\u011f\u0131ms\u0131z bir oyun st\u00fcdyosu, yat\u0131r\u0131mc\u0131lara ve potansiyel oyunculara projelerini sunmak i\u00e7in 3D sanal bir st\u00fcdyo ortam\u0131 tasarlad\u0131. Bu st\u00fcdyoda:<\/p>\n<ul>\n<li>Ziyaret\u00e7iler, st\u00fcdyo i\u00e7indeki \"i\u015f istasyonlar\u0131na\" yakla\u015farak farkl\u0131 oyun projeleri hakk\u0131nda bilgi alabiliyorlard\u0131.<\/li>\n<li>Her i\u015f istasyonu, ilgili oyunun 3D karakter modellerini, d\u00fc\u015fman tasar\u0131mlar\u0131n\u0131 ve \u00e7evre objelerini sergileyen interaktif bir ekrana sahipti. Kullan\u0131c\u0131lar bu modelleri 360 derece d\u00f6nd\u00fcrebiliyorlard\u0131.<\/li>\n<li>\"Oyun Odas\u0131\" ad\u0131 verilen ayr\u0131 bir b\u00f6l\u00fcmde, oyunlar\u0131n k\u0131sa oynan\u0131\u015f demolar\u0131 video ekranlar\u0131nda g\u00f6steriliyordu.<\/li>\n<li>Duvarlarda, st\u00fcdyonun sanat tarz\u0131n\u0131 ve genel vizyonunu yans\u0131tan konsept sanat eserleri ve geli\u015ftirici g\u00fcnl\u00fckleri sergileniyordu.<\/li>\n<\/ul>\n<p>Bu sanal st\u00fcdyo, PixelForge Games'in yarat\u0131c\u0131l\u0131\u011f\u0131n\u0131 ve teknik yetkinli\u011fini etkileyici bir \u015fekilde sergilemesini sa\u011flad\u0131. Yat\u0131r\u0131mc\u0131lar, oyunlar\u0131n g\u00f6rsel kalitesini ve potansiyelini daha iyi de\u011ferlendirirken, oyuncular da geli\u015ftirme s\u00fcrecine dair i\u00e7g\u00f6r\u00fcler edindi ve st\u00fcdyonun hayran kitlesi olu\u015fmaya ba\u015flad\u0131. Bu, onlar\u0131n yeni projeler i\u00e7in fon toplamalar\u0131na ve erken eri\u015fim programlar\u0131na ilgi \u00e7ekmelerine yard\u0131mc\u0131 oldu.<\/p>\n<h3>Vaka Analizi 3: Bir Dijital Sanat\u00e7\u0131n\u0131n Sanal NFT Galerisi<\/h3>\n<p>\"CryptoArt Creator\" takma adl\u0131 bir dijital sanat\u00e7\u0131, NFT (Non-Fungible Token) eserlerini sergilemek ve satmak i\u00e7in ki\u015fisel bir 3D sanal galeri olu\u015fturdu. Bu galeri, sanat\u00e7\u0131n\u0131n benzersiz tarz\u0131n\u0131 yans\u0131tacak \u015fekilde minimalist ve modern bir tasar\u0131ma sahipti:<\/p>\n<ul>\n<li>Galerideki her sanat eseri (NFT), 3D bir \u00e7er\u00e7eve i\u00e7inde duvara as\u0131l\u0131yd\u0131.<\/li>\n<li>Kullan\u0131c\u0131lar, bir esere yakla\u015ft\u0131klar\u0131nda veya t\u0131klad\u0131klar\u0131nda, eserin detayl\u0131 bilgilerini (sanat\u00e7\u0131 ad\u0131, eser ad\u0131, a\u00e7\u0131klama, blok zinciri kimli\u011fi) g\u00f6steren bir bilgi paneli a\u00e7\u0131l\u0131yordu.<\/li>\n<li>En \u00f6nemlisi, bilgi panelinde eserin OpenSea veya Rarible gibi NFT pazar yerindeki do\u011frudan sat\u0131\u015f sayfas\u0131na y\u00f6nlendiren bir buton bulunuyordu.<\/li>\n<li>Baz\u0131 odalarda, sanat\u00e7\u0131n\u0131n eserlerinin olu\u015fturulma s\u00fcrecini g\u00f6steren k\u0131sa timelapse videolar\u0131 da sergileniyordu.<\/li>\n<\/ul>\n<p>Bu sanal galeri, sanat\u00e7\u0131n\u0131n eserlerini geleneksel 2D web sitelerine g\u00f6re \u00e7ok daha s\u00fcr\u00fckleyici ve etkile\u015fimli bir \u015fekilde sunmas\u0131n\u0131 sa\u011flad\u0131. NFT koleksiyoncular\u0131 ve al\u0131c\u0131lar\u0131, eserleri sanal bir ortamda deneyimlemenin keyfini \u00e7\u0131kar\u0131rken, ayn\u0131 zamanda kolayca sat\u0131n alma i\u015flemine y\u00f6nlendirilebiliyordu. Bu platform, sanat\u00e7\u0131n\u0131n dijital d\u00fcnyadaki varl\u0131\u011f\u0131n\u0131 g\u00fc\u00e7lendirdi ve eserlerinin daha geni\u015f bir kitleye ula\u015fmas\u0131na yard\u0131mc\u0131 oldu, sonu\u00e7 olarak sat\u0131\u015flar\u0131nda \u00f6nemli bir art\u0131\u015f sa\u011flad\u0131. Bu vaka analizleri, 3D sanal portf\u00f6y odalar\u0131n\u0131n sadece teknik bir g\u00f6steri de\u011fil, ayn\u0131 zamanda pratik i\u015f de\u011feri ta\u015f\u0131yan g\u00fc\u00e7l\u00fc bir ara\u00e7 olabilece\u011fini a\u00e7\u0131k\u00e7a ortaya koymaktad\u0131r.<\/p>\n<h2>Gelece\u011fe Bak\u0131\u015f: Metaverse ve Sanal Portf\u00f6ylerin Evrimi<\/h2>\n<p>3D sanal portf\u00f6y odalar\u0131, sadece mevcut web deneyimlerini zenginle\u015ftiren ara\u00e7lar olmakla kalmay\u0131p, ayn\u0131 zamanda gelece\u011fin interneti olan Metaverse'e at\u0131lan ilk ad\u0131mlardan birini temsil ediyor. Metaverse, kullan\u0131c\u0131lar\u0131n sanal d\u00fcnyalarda sosyalle\u015febildi\u011fi, \u00e7al\u0131\u015fabildi\u011fi, e\u011flenebildi\u011fi ve ticaret yapabildi\u011fi, kal\u0131c\u0131 ve birbirine ba\u011fl\u0131 3D ortamlar a\u011f\u0131 olarak tan\u0131mlanabilir. Bu vizyon ger\u00e7e\u011fe d\u00f6n\u00fc\u015ft\u00fck\u00e7e, sanal portf\u00f6ylerin rol\u00fc ve potansiyeli de b\u00fcy\u00fck \u00f6l\u00e7\u00fcde evrilecektir.<\/p>\n<p><strong>Metaverse Entegrasyon Potansiyeli:<\/strong> \u015eu anda ba\u011f\u0131ms\u0131z bir web sayfas\u0131 olarak var olan 3D sanal portf\u00f6y odan\u0131z, gelecekte farkl\u0131 Metaverse platformlar\u0131na entegre edilebilir. \u00d6rne\u011fin, bir \"arazi\" sat\u0131n ald\u0131\u011f\u0131n\u0131z Decentraland veya The Sandbox gibi platformlarda kendi sanal galerinizin bir kopyas\u0131n\u0131 olu\u015fturabilir ve projelerinizi orada sergileyebilirsiniz. Bu, sadece web taray\u0131c\u0131s\u0131 \u00fczerinden de\u011fil, ayn\u0131 zamanda VR ba\u015fl\u0131klar\u0131 arac\u0131l\u0131\u011f\u0131yla ger\u00e7ek anlamda \"i\u00e7ine girilebilen\" bir deneyim sunar. B\u00f6ylece, d\u00fcnyan\u0131n d\u00f6rt bir yan\u0131ndaki insanlar, kendi avatarlar\u0131yla galerinizde bulu\u015fabilir, projelerinizi birlikte inceleyebilir ve hatta canl\u0131 etkile\u015fim kurabilirler.<\/p>\n<p><strong>NFT Galerileri ve Dijital Varl\u0131k Ekonomisi:<\/strong> NFT'lerin y\u00fckseli\u015fiyle birlikte, sanal portf\u00f6ylerin \u00f6nemi daha da artt\u0131. Dijital sanat\u00e7\u0131lar, tasar\u0131mc\u0131lar ve koleksiyoncular, sahip olduklar\u0131 NFT'leri sanal galerilerinde sergilemek ve satmak i\u00e7in bu t\u00fcr odalar\u0131 kullan\u0131yor. Gelecekte, sanal portf\u00f6y odan\u0131z, sadece projelerinizi sergiledi\u011finiz bir yer olmakla kalmayacak, ayn\u0131 zamanda entegre bir e-ticaret platformu gibi i\u015flev g\u00f6recek. Kullan\u0131c\u0131lar, be\u011fendikleri bir dijital esere t\u0131klayarak do\u011frudan c\u00fczdanlar\u0131ndan kripto para birimi ile sat\u0131n alma i\u015flemi ger\u00e7ekle\u015ftirebilecekler. Bu, sanat\u00e7\u0131 ve yarat\u0131c\u0131lar i\u00e7in eserlerini k\u00fcresel bir kitleye ula\u015ft\u0131rman\u0131n ve do\u011frudan gelir elde etmenin devrim niteli\u011finde bir yolu olacakt\u0131r.<\/p>\n<p><strong>Sosyal Etkile\u015fim ve \u0130\u015fbirli\u011fi:<\/strong> Sanal portf\u00f6y odalar\u0131, gelecekte \u00e7ok daha sosyal ve i\u015fbirli\u011fine a\u00e7\u0131k hale gelebilir. Art\u0131k sadece tek ki\u015filik bir gezi deneyimi sunmak yerine, arkada\u015flar\u0131n\u0131zla veya meslekta\u015flar\u0131n\u0131zla ayn\u0131 sanal odada bulu\u015fup projeleri birlikte inceleyebilirsiniz. Sesli ve yaz\u0131l\u0131 sohbet \u00f6zellikleri entegre edilerek, projeler hakk\u0131nda an\u0131nda geri bildirim almak veya i\u015fbirli\u011fi yapmak m\u00fcmk\u00fcn hale gelecektir. Mimarlar, m\u00fc\u015fterileriyle birlikte sanal bir binay\u0131 gezebilir ve de\u011fi\u015fiklikleri an\u0131nda tart\u0131\u015fabilirken, oyun geli\u015ftiricileri, yeni konseptleri tak\u0131m \u00fcyeleriyle birlikte deneyimleyebilir. Bu, uzaktan \u00e7al\u0131\u015fman\u0131n ve k\u00fcresel i\u015fbirli\u011finin yeni bir boyutunu a\u00e7acakt\u0131r.<\/p>\n<p>Sanal portf\u00f6ylerin evrimi, ayn\u0131 zamanda <strong>art\u0131r\u0131lm\u0131\u015f ger\u00e7eklik (AR)<\/strong> teknolojileriyle de yak\u0131ndan ili\u015fkilidir. Mobil cihazlar\u0131n\u0131z arac\u0131l\u0131\u011f\u0131yla fiziksel d\u00fcnyan\u0131za dijital objeler yerle\u015ftirebilece\u011finiz AR portf\u00f6yler, projelerinizi ger\u00e7ek ba\u011flamlar\u0131nda sergilemenizi sa\u011flayabilir. \u00d6rne\u011fin, bir i\u00e7 mimar tasarlad\u0131\u011f\u0131 mobilyalar\u0131 m\u00fc\u015fterisinin kendi oturma odas\u0131nda AR ile g\u00f6sterebilir veya bir \u00fcr\u00fcn tasar\u0131mc\u0131s\u0131, yeni \u00fcr\u00fcn\u00fcn\u00fcn prototipini sanal olarak masan\u0131z\u0131n \u00fczerinde sergileyebilir. Bu yenilikler, yarat\u0131c\u0131 profesyonellerin kendilerini ifade etme ve projelerini sunma bi\u00e7imlerinde k\u00f6kl\u00fc de\u011fi\u015fiklikler yaratacak ve dijital kimli\u011finizi Metaverse'in kal\u0131c\u0131 bir par\u00e7as\u0131 haline getirecektir.<\/p>\n<h2>Sonu\u00e7: Dijital Portf\u00f6y\u00fcn\u00fcz\u00fc Bir \u00dcst Seviyeye Ta\u015f\u0131y\u0131n<\/h2>\n<p>Dijital \u00e7a\u011fda kendinizi veya projelerinizi \u00f6ne \u00e7\u0131karman\u0131n yolu, s\u0131radanl\u0131\u011f\u0131n \u00f6tesine ge\u00e7mekten ge\u00e7iyor. Geleneksel portf\u00f6y sunumlar\u0131n\u0131n s\u0131n\u0131rlay\u0131c\u0131 yap\u0131s\u0131n\u0131n aksine, 3D sanal portf\u00f6y odalar\u0131, yarat\u0131c\u0131l\u0131\u011f\u0131n\u0131z\u0131, teknik yetkinli\u011finizi ve inovasyon anlay\u0131\u015f\u0131n\u0131z\u0131 benzersiz bir \u015fekilde sergilemenizi sa\u011flayan g\u00fc\u00e7l\u00fc bir ara\u00e7t\u0131r. Bu rehberde ele ald\u0131\u011f\u0131m\u0131z temel kavramlardan ba\u015flayarak, Blender ile modelleme, Three.js ile web entegrasyonu, interaktif elementler ekleme ve performans optimizasyonu gibi ad\u0131mlarla, kendi sanal alan\u0131n\u0131z\u0131 nas\u0131l in\u015fa edece\u011finizi \u00f6\u011frendiniz. Ger\u00e7ek d\u00fcnya vaka analizleri, bu teknolojinin farkl\u0131 sekt\u00f6rlerde nas\u0131l somut faydalar sa\u011flad\u0131\u011f\u0131n\u0131 g\u00f6sterirken, Metaverse'e bir bak\u0131\u015f, gelecekteki potansiyeline i\u015faret etti.<\/p>\n<p>Bir 3D sanal portf\u00f6y odas\u0131 olu\u015fturmak, sadece teknik bir ba\u015far\u0131 de\u011fil, ayn\u0131 zamanda dijital kimli\u011finize yapt\u0131\u011f\u0131n\u0131z stratejik bir yat\u0131r\u0131md\u0131r. Bu platform, potansiyel m\u00fc\u015fterilerinize, i\u015fverenlerinize veya i\u015f ortaklar\u0131n\u0131za sadece ne yapt\u0131\u011f\u0131n\u0131z\u0131 de\u011fil, ayn\u0131 zamanda nas\u0131l bir vizyona sahip oldu\u011funuzu da anlat\u0131r. Onlara, projenizin i\u00e7ine ad\u0131m atma, onu farkl\u0131 a\u00e7\u0131lardan inceleme ve sizinle daha derin bir ba\u011f kurma f\u0131rsat\u0131 sunar. S\u00fcrekli geli\u015fen web teknolojileri sayesinde, bu t\u00fcr interaktif deneyimler art\u0131k sadece b\u00fcy\u00fck \u015firketlerin de\u011fil, her yarat\u0131c\u0131 profesyonelin ula\u015fabilece\u011fi bir noktaya gelmi\u015ftir. Unutmay\u0131n, iyi tasarlanm\u0131\u015f ve optimize edilmi\u015f bir sanal portf\u00f6y odas\u0131, ziyaret\u00e7ileriniz \u00fczerinde kal\u0131c\u0131 bir etki b\u0131rakacak ve sizi rakiplerinizden ay\u0131racakt\u0131r. \u015eimdi kendi sanal \u015faheserinizi yaratma zaman\u0131! Projelerinizin hak etti\u011fi ilgiyi g\u00f6rmesi i\u00e7in bu heyecan verici yola ad\u0131m at\u0131n ve dijital varl\u0131\u011f\u0131n\u0131z\u0131 bir \u00fcst seviyeye ta\u015f\u0131y\u0131n.<\/p>\n<h3>S\u0131k\u00e7a Sorulan Sorular<\/h3>\n<ul>\n<li>\n <strong>S: 3D sanal portf\u00f6y odas\u0131 olu\u015fturmak i\u00e7in hangi yaz\u0131l\u0131mlara ihtiyac\u0131m var?<\/strong><br \/>\n C: Genellikle 3D modelleme i\u00e7in Blender (\u00fccretsiz ve a\u00e7\u0131k kaynakl\u0131), 3ds Max veya Maya gibi bir yaz\u0131l\u0131ma, web tabanl\u0131 3D sahne olu\u015fturmak i\u00e7in ise Three.js veya Babylon.js gibi JavaScript k\u00fct\u00fcphanelerine ihtiyac\u0131n\u0131z olacakt\u0131r. Basit HTML, CSS ve JavaScript bilgisi de gereklidir.\n <\/li>\n<li>\n <strong>S: Hi\u00e7 3D modelleme veya kodlama deneyimim yok, yine de yapabilir miyim?<\/strong><br \/>\n C: Evet, kesinlikle yapabilirsiniz! Blender gibi yaz\u0131l\u0131mlar i\u00e7in \u00e7ok say\u0131da \u00fccretsiz e\u011fitim kayna\u011f\u0131 mevcuttur ve Three.js'in temel seviyede kullan\u0131m\u0131 da ad\u0131m ad\u0131m \u00f6\u011frenilebilir. Ba\u015flang\u0131\u00e7ta daha basit odalar ve interaktif elementlerle ba\u015flay\u0131p, deneyim kazand\u0131k\u00e7a projenizi geli\u015ftirebilirsiniz. Unutmay\u0131n, herkes bir yerden ba\u015flar.\n <\/li>\n<li>\n <strong>S: Sanal portf\u00f6y odam\u0131 mobil cihazlarda da sorunsuz \u00e7al\u0131\u015ft\u0131rmak i\u00e7in ne yapmal\u0131y\u0131m?<\/strong><br \/>\n C: Mobil uyumluluk i\u00e7in, 3D modellerinizi poligon say\u0131s\u0131 ve doku kalitesi a\u00e7\u0131s\u0131ndan optimize etmeniz, webGL renderer'\u0131n pixelRatio de\u011ferini ayarlaman\u0131z ve kullan\u0131c\u0131 aray\u00fcz\u00fcn\u00fcz\u00fc (UI) CSS media query'leri ile duyarl\u0131 hale getirmeniz \u00f6nemlidir. Ayr\u0131ca, mobil cihazlarda dokunmatik etkile\u015fimleri destekleyecek kontrol mekanizmalar\u0131 kullanmal\u0131s\u0131n\u0131z.\n <\/li>\n<li>\n <strong>S: Three.js yerine ba\u015fka bir k\u00fct\u00fcphane kullanabilir miyim?<\/strong><br \/>\n C: Elbette! Three.js yayg\u0131n olarak kullan\u0131lsa da, Babylon.js gibi g\u00fc\u00e7l\u00fc alternatifler de mevcuttur. Babylon.js, daha \u00e7ok oyun motoru benzeri bir yap\u0131ya sahip olup, daha y\u00fcksek seviyeli soyutlamalar ve haz\u0131r bile\u015fenler sunabilir. Se\u00e7iminiz, projenizin gereksinimlerine ve ki\u015fisel tercihlerinize ba\u011fl\u0131d\u0131r.\n <\/li>\n<li>\n <strong>S: Sanal portf\u00f6y odam\u0131 web siteme nas\u0131l entegre edebilirim?<\/strong><br \/>\n C: Sanal portf\u00f6y odan\u0131z\u0131 olu\u015fturdu\u011funuz HTML, CSS ve JavaScript dosyalar\u0131n\u0131 standart bir web sitesi gibi hosting sa\u011flay\u0131c\u0131n\u0131za y\u00fcklemeniz yeterlidir. Kendi alan ad\u0131n\u0131z alt\u0131nda bir alt dizinde veya alt alanda yay\u0131nlayabilir, ana web sitenizden bu sayfaya bir ba\u011flant\u0131 verebilirsiniz.\n <\/li>\n<\/ul>\n<p><\/body><\/p>\n","protected":false},"excerpt":{"rendered":"Yarat\u0131c\u0131 projelerinizi dijital d\u00fcnyada etkileyici bir \u015fekilde sergilemek ister misiniz? Geleneksel portf\u00f6y sunumlar\u0131n\u0131n \u00f6tesine ge\u00e7erek, izleyicilerinizi sanal bir…","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"csco_page_header_type":"","csco_page_load_nextpost":"","csco_page_subscribe_form":"","csco_page_contact_form":"","footnotes":""},"categories":[1],"tags":[],"class_list":{"0":"post-35001","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-genel","7":"cs-entry","8":"cs-video-wrap"},"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v20.5 (Yoast SEO v25.3.1) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>3D Sanal Portf\u00f6y Odas\u0131 Nas\u0131l Olu\u015fturulur? Kapsaml\u0131 Rehber<\/title>\n<meta name=\"description\" content=\"Yarat\u0131c\u0131 projelerinizi dijital d\u00fcnyada etkileyici bir \u015fekilde sergilemek ister misiniz? Geleneksel portf\u00f6y sunumlar\u0131n\u0131n \u00f6tesine ge\u00e7erek, izleyicilerinizi sanal bir ortama davet edip projelerinizi \u00fc\u00e7 boyutlu olarak deneyimlemelerini sa\u011flamak art\u0131k hayal de\u011fil. Bu kapsaml\u0131 rehber, 3D sanal portf\u00f6y odas\u0131 olu\u015fturman\u0131n t\u00fcm ad\u0131mlar\u0131n\u0131, teknolojilerini, ipu\u00e7lar\u0131n\u0131 ve ba\u015far\u0131l\u0131 \u00f6rneklerini ad\u0131m ad\u0131m ke\u015ffetmenizi sa\u011flayacak. Dijital kimli\u011finizi g\u00fc\u00e7lendirmek ve potansiyel m\u00fc\u015fterileriniz veya i\u015fverenleriniz \u00fczerinde unutulmaz bir izlenim b\u0131rakmak i\u00e7in haz\u0131rsan\u0131z, bu sanal maceraya ba\u015flayal\u0131m.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/\" \/>\n<meta property=\"og:locale\" content=\"tr_TR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"3D Sanal Portf\u00f6y Odas\u0131 Nas\u0131l Olu\u015fturulur? Kapsaml\u0131 Rehber\" \/>\n<meta property=\"og:description\" content=\"Yarat\u0131c\u0131 projelerinizi dijital d\u00fcnyada etkileyici bir \u015fekilde sergilemek ister misiniz? Geleneksel portf\u00f6y sunumlar\u0131n\u0131n \u00f6tesine ge\u00e7erek, izleyicilerinizi sanal bir ortama davet edip projelerinizi \u00fc\u00e7 boyutlu olarak deneyimlemelerini sa\u011flamak art\u0131k hayal de\u011fil. Bu kapsaml\u0131 rehber, 3D sanal portf\u00f6y odas\u0131 olu\u015fturman\u0131n t\u00fcm ad\u0131mlar\u0131n\u0131, teknolojilerini, ipu\u00e7lar\u0131n\u0131 ve ba\u015far\u0131l\u0131 \u00f6rneklerini ad\u0131m ad\u0131m ke\u015ffetmenizi sa\u011flayacak. Dijital kimli\u011finizi g\u00fc\u00e7lendirmek ve potansiyel m\u00fc\u015fterileriniz veya i\u015fverenleriniz \u00fczerinde unutulmaz bir izlenim b\u0131rakmak i\u00e7in haz\u0131rsan\u0131z, bu sanal maceraya ba\u015flayal\u0131m.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/\" \/>\n<meta property=\"og:site_name\" content=\"Kodlar\u0131n Gizemli D\u00fcnyas\u0131\" \/>\n<meta property=\"article:published_time\" content=\"2025-11-24T15:01:15+00:00\" \/>\n<meta name=\"author\" content=\"Fatih Soysal\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Yazan:\" \/>\n\t<meta name=\"twitter:data1\" content=\"Fatih Soysal\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tahmini okuma s\u00fcresi\" \/>\n\t<meta name=\"twitter:data2\" content=\"30 dakika\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/\"},\"author\":{\"name\":\"Fatih Soysal\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"headline\":\"3D Sanal Portf\u00f6y Odas\u0131 Nas\u0131l Olu\u015fturulur? Kapsaml\u0131 Rehber\",\"datePublished\":\"2025-11-24T15:01:15+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/\"},\"wordCount\":5229,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/#respond\"]}],\"copyrightYear\":\"2025\",\"copyrightHolder\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/\",\"name\":\"3D Sanal Portf\u00f6y Odas\u0131 Nas\u0131l Olu\u015fturulur? Kapsaml\u0131 Rehber\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\"},\"datePublished\":\"2025-11-24T15:01:15+00:00\",\"description\":\"Yarat\u0131c\u0131 projelerinizi dijital d\u00fcnyada etkileyici bir \u015fekilde sergilemek ister misiniz? Geleneksel portf\u00f6y sunumlar\u0131n\u0131n \u00f6tesine ge\u00e7erek, izleyicilerinizi sanal bir ortama davet edip projelerinizi \u00fc\u00e7 boyutlu olarak deneyimlemelerini sa\u011flamak art\u0131k hayal de\u011fil. Bu kapsaml\u0131 rehber, 3D sanal portf\u00f6y odas\u0131 olu\u015fturman\u0131n t\u00fcm ad\u0131mlar\u0131n\u0131, teknolojilerini, ipu\u00e7lar\u0131n\u0131 ve ba\u015far\u0131l\u0131 \u00f6rneklerini ad\u0131m ad\u0131m ke\u015ffetmenizi sa\u011flayacak. Dijital kimli\u011finizi g\u00fc\u00e7lendirmek ve potansiyel m\u00fc\u015fterileriniz veya i\u015fverenleriniz \u00fczerinde unutulmaz bir izlenim b\u0131rakmak i\u00e7in haz\u0131rsan\u0131z, bu sanal maceraya ba\u015flayal\u0131m.\",\"breadcrumb\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/#breadcrumb\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Anasayfa\",\"item\":\"https:\/\/fatihsoysal.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"3D Sanal Portf\u00f6y Odas\u0131 Nas\u0131l Olu\u015fturulur? Kapsaml\u0131 Rehber\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/\",\"name\":\"Fatihsoysal.com\",\"description\":\"Blog - Yaz\u0131l\u0131m D\u00fcnyas\u0131 Tecr\u00fcbelerim\",\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/fatihsoysal.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"tr\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\",\"name\":\"Fatih Soysal\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"tr\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png\",\"contentUrl\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png\",\"width\":512,\"height\":512,\"caption\":\"Fatih Soysal\"},\"logo\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/\"},\"description\":\"Kullan\u0131m ve kodlama m\u00fckemmeliyetini odak alan uygulamalar olu\u015fturma deneyimine sahip, profesyonel olarak 15+ y\u0131l \u00fczeri deneyime sahip bir yaz\u0131l\u0131m m\u00fchendisi.\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/author\/fatihsoysal\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"3D Sanal Portf\u00f6y Odas\u0131 Nas\u0131l Olu\u015fturulur? Kapsaml\u0131 Rehber","description":"Yarat\u0131c\u0131 projelerinizi dijital d\u00fcnyada etkileyici bir \u015fekilde sergilemek ister misiniz? Geleneksel portf\u00f6y sunumlar\u0131n\u0131n \u00f6tesine ge\u00e7erek, izleyicilerinizi sanal bir ortama davet edip projelerinizi \u00fc\u00e7 boyutlu olarak deneyimlemelerini sa\u011flamak art\u0131k hayal de\u011fil. Bu kapsaml\u0131 rehber, 3D sanal portf\u00f6y odas\u0131 olu\u015fturman\u0131n t\u00fcm ad\u0131mlar\u0131n\u0131, teknolojilerini, ipu\u00e7lar\u0131n\u0131 ve ba\u015far\u0131l\u0131 \u00f6rneklerini ad\u0131m ad\u0131m ke\u015ffetmenizi sa\u011flayacak. Dijital kimli\u011finizi g\u00fc\u00e7lendirmek ve potansiyel m\u00fc\u015fterileriniz veya i\u015fverenleriniz \u00fczerinde unutulmaz bir izlenim b\u0131rakmak i\u00e7in haz\u0131rsan\u0131z, bu sanal maceraya ba\u015flayal\u0131m.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/","og_locale":"tr_TR","og_type":"article","og_title":"3D Sanal Portf\u00f6y Odas\u0131 Nas\u0131l Olu\u015fturulur? Kapsaml\u0131 Rehber","og_description":"Yarat\u0131c\u0131 projelerinizi dijital d\u00fcnyada etkileyici bir \u015fekilde sergilemek ister misiniz? Geleneksel portf\u00f6y sunumlar\u0131n\u0131n \u00f6tesine ge\u00e7erek, izleyicilerinizi sanal bir ortama davet edip projelerinizi \u00fc\u00e7 boyutlu olarak deneyimlemelerini sa\u011flamak art\u0131k hayal de\u011fil. Bu kapsaml\u0131 rehber, 3D sanal portf\u00f6y odas\u0131 olu\u015fturman\u0131n t\u00fcm ad\u0131mlar\u0131n\u0131, teknolojilerini, ipu\u00e7lar\u0131n\u0131 ve ba\u015far\u0131l\u0131 \u00f6rneklerini ad\u0131m ad\u0131m ke\u015ffetmenizi sa\u011flayacak. Dijital kimli\u011finizi g\u00fc\u00e7lendirmek ve potansiyel m\u00fc\u015fterileriniz veya i\u015fverenleriniz \u00fczerinde unutulmaz bir izlenim b\u0131rakmak i\u00e7in haz\u0131rsan\u0131z, bu sanal maceraya ba\u015flayal\u0131m.","og_url":"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/","og_site_name":"Kodlar\u0131n Gizemli D\u00fcnyas\u0131","article_published_time":"2025-11-24T15:01:15+00:00","author":"Fatih Soysal","twitter_card":"summary_large_image","twitter_misc":{"Yazan:":"Fatih Soysal","Tahmini okuma s\u00fcresi":"30 dakika"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/#article","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/"},"author":{"name":"Fatih Soysal","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"headline":"3D Sanal Portf\u00f6y Odas\u0131 Nas\u0131l Olu\u015fturulur? Kapsaml\u0131 Rehber","datePublished":"2025-11-24T15:01:15+00:00","mainEntityOfPage":{"@id":"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/"},"wordCount":5229,"commentCount":0,"publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"inLanguage":"tr","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/#respond"]}],"copyrightYear":"2025","copyrightHolder":{"@id":"https:\/\/fatihsoysal.com\/blog\/#organization"}},{"@type":"WebPage","@id":"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/","url":"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/","name":"3D Sanal Portf\u00f6y Odas\u0131 Nas\u0131l Olu\u015fturulur? Kapsaml\u0131 Rehber","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/#website"},"datePublished":"2025-11-24T15:01:15+00:00","description":"Yarat\u0131c\u0131 projelerinizi dijital d\u00fcnyada etkileyici bir \u015fekilde sergilemek ister misiniz? Geleneksel portf\u00f6y sunumlar\u0131n\u0131n \u00f6tesine ge\u00e7erek, izleyicilerinizi sanal bir ortama davet edip projelerinizi \u00fc\u00e7 boyutlu olarak deneyimlemelerini sa\u011flamak art\u0131k hayal de\u011fil. Bu kapsaml\u0131 rehber, 3D sanal portf\u00f6y odas\u0131 olu\u015fturman\u0131n t\u00fcm ad\u0131mlar\u0131n\u0131, teknolojilerini, ipu\u00e7lar\u0131n\u0131 ve ba\u015far\u0131l\u0131 \u00f6rneklerini ad\u0131m ad\u0131m ke\u015ffetmenizi sa\u011flayacak. Dijital kimli\u011finizi g\u00fc\u00e7lendirmek ve potansiyel m\u00fc\u015fterileriniz veya i\u015fverenleriniz \u00fczerinde unutulmaz bir izlenim b\u0131rakmak i\u00e7in haz\u0131rsan\u0131z, bu sanal maceraya ba\u015flayal\u0131m.","breadcrumb":{"@id":"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/#breadcrumb"},"inLanguage":"tr","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/fatihsoysal.com\/blog\/3d-sanal-portfoy-odasi-nasil-olusturulur-kapsamli-rehber\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Anasayfa","item":"https:\/\/fatihsoysal.com\/blog\/"},{"@type":"ListItem","position":2,"name":"3D Sanal Portf\u00f6y Odas\u0131 Nas\u0131l Olu\u015fturulur? Kapsaml\u0131 Rehber"}]},{"@type":"WebSite","@id":"https:\/\/fatihsoysal.com\/blog\/#website","url":"https:\/\/fatihsoysal.com\/blog\/","name":"Fatihsoysal.com","description":"Blog - Yaz\u0131l\u0131m D\u00fcnyas\u0131 Tecr\u00fcbelerim","publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/fatihsoysal.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"tr"},{"@type":["Person","Organization"],"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1","name":"Fatih Soysal","image":{"@type":"ImageObject","inLanguage":"tr","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png","contentUrl":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png","width":512,"height":512,"caption":"Fatih Soysal"},"logo":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/"},"description":"Kullan\u0131m ve kodlama m\u00fckemmeliyetini odak alan uygulamalar olu\u015fturma deneyimine sahip, profesyonel olarak 15+ y\u0131l \u00fczeri deneyime sahip bir yaz\u0131l\u0131m m\u00fchendisi.","url":"https:\/\/fatihsoysal.com\/blog\/author\/fatihsoysal\/"}]}},"yoast_meta":{"yoast_wpseo_title":"","yoast_wpseo_metadesc":"","yoast_wpseo_canonical":""},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/35001","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/comments?post=35001"}],"version-history":[{"count":0,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/35001\/revisions"}],"wp:attachment":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/media?parent=35001"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/categories?post=35001"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/tags?post=35001"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}