diff --git a/examples/models/gltf/PrimaryIonDrive.glb b/examples/models/gltf/PrimaryIonDrive.glb
new file mode 100644
index 00000000000000..fb70aef5758fea
Binary files /dev/null and b/examples/models/gltf/PrimaryIonDrive.glb differ
diff --git a/examples/webgl_postprocessing_unreal_bloom.html b/examples/webgl_postprocessing_unreal_bloom.html
index 84df729853164e..0a8bbee7e93bbf 100644
--- a/examples/webgl_postprocessing_unreal_bloom.html
+++ b/examples/webgl_postprocessing_unreal_bloom.html
@@ -1,223 +1,166 @@
 <!DOCTYPE html>
 <html lang="en">
 	<head>
-		<title>threejs webgl - materials - hdr environment mapping</title>
+		<title>three.js webgl - postprocessing - unreal bloom</title>
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 		<style>
 			body {
-				background-color: #000000;
-				margin: 0px;
-				overflow: hidden;
+				color: #fff;
 				font-family:Monospace;
 				font-size:13px;
 				text-align:center;
-				font-weight: bold;
-			}
-			a {
-				color:#00ff78;
+				background-color: #fff;
+				margin: 0px;
+				overflow: hidden;
 			}
-
 			#info {
-				color: #fff;
 				position: absolute;
-				top: 10px;
+				top: 0px;
 				width: 100%;
-				text-align: center;
-				display:block;
+				padding: 5px;
 			}
-			.dg.ac {
-				z-index: 1 !important; /* FIX DAT.GUI */
+			#info p {
+				max-width: 600px;
+				margin-left: auto;
+				margin-right: auto;
+				padding: 0 2em;
+			}
+			a {
+				color: #2983ff;
 			}
 		</style>
 	</head>
+
 	<body>
 
+		<div id="container"></div>
+
+		<div id="info">
+			<a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> - Bloom pass by <a href="http://eduperiment.com" target="_blank" rel="noopener">Prashant Sharma</a> and <a href="https://clara.io" target="_blank" rel="noopener">Ben Houston</a>
+			<p>			
+				This Bloom Pass is inspired by the bloom pass of the Unreal Engine. It creates a mip map chain of bloom textures and blur them
+				with different radii. Because of the weigted combination of mips, and since larger blurs are done on higher mips this bloom
+				is better in quality and performance.
+			</p>
+			Model: <a href="https://sketchfab.com/models/d3f50a66fee74c6588dd9bc92f7fe7b3" target="_blank" rel="noopener">Primary Ion Drive</a> by
+			<a href="https://sketchfab.com/indierocktopus" target="_blank" rel="noopener">indierocktopus</a>, CC Attribution.<br/>
+			Details in <a href="https://blog.sketchfab.com/art-spotlight-primary-ion-drive/" target="_blank" rel="noopener">Art Spotlight</a> blog post.
+		</div>
+
 		<script src="../build/three.js"></script>
-		<script src="js/controls/OrbitControls.js"></script>
-		<script src="js/loaders/RGBELoader.js"></script>
-		<script src="js/loaders/HDRCubeTextureLoader.js"></script>
 
 		<script src="js/Detector.js"></script>
 		<script src="js/libs/stats.min.js"></script>
-
-		<script src="js/pmrem/PMREMGenerator.js"></script>
-		<script src="js/pmrem/PMREMCubeUVPacker.js"></script>
 		<script src="js/libs/dat.gui.min.js"></script>
+		<script src="js/controls/OrbitControls.js"></script>
+		<script src="js/loaders/GLTFLoader.js"></script>
 
 		<script src="js/postprocessing/EffectComposer.js"></script>
 		<script src="js/postprocessing/RenderPass.js"></script>
-		<script src="js/postprocessing/MaskPass.js"></script>
 		<script src="js/postprocessing/ShaderPass.js"></script>
 		<script src="js/shaders/CopyShader.js"></script>
-		<script src="js/shaders/FXAAShader.js"></script>
-		<script src="js/shaders/ConvolutionShader.js"></script>
 		<script src="js/shaders/LuminosityHighPassShader.js"></script>
 		<script src="js/postprocessing/UnrealBloomPass.js"></script>
 
-		<div id="info">
-			<a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> - Bloom pass by <a href="http://eduperiment.com" target="_blank" rel="noopener">Prashant Sharma</a> and <a href="https://clara.io" target="_blank" rel="noopener">Ben Houston</a><br/><br/>
-			This Bloom Pass is inspired by the bloom pass of the Unreal Engine. It creates a mip map chain of bloom textures and blur them <br>
-			with different radii. Because of the weigted combination of mips, and since larger blurs are done on higher mips this bloom <br>
-			is better in quality and performance.<br>
-		</div>
-
 		<script>
 
-			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+			var scene, camera, controls, pointLight, stats;
+			var composer, renderer, mixer;
 
-			var container, stats;
 			var params = {
 				projection: 'normal',
 				background: false,
-				exposure: 0.9,
+				exposure: 1,
 				bloomStrength: 1.5,
-				bloomThreshold: 0.85,
-				bloomRadius: 0.4
+				bloomThreshold: 0,
+				bloomRadius: 0
 			};
-			var camera, scene, renderer, controls, objects = [];
-			var effectFXAA, bloomPass, renderScene;
-			var hdrCubeMap;
-			var composer;
-			var standardMaterial;
-			var hdrCubeRenderTarget;
-
-			init();
-			animate();
-
-			function init() {
-
-				container = document.createElement( 'div' );
-				document.body.appendChild( container );
-
-				camera = new THREE.PerspectiveCamera( 40, window.innerWidth / window.innerHeight, 1, 2000 );
-				camera.position.set( 0.0, 35, 35 * 3.5 );
-
-				scene = new THREE.Scene();
-				scene.background = new THREE.Color( 0x111111 );
-
-				renderer = new THREE.WebGLRenderer();
-				renderer.toneMapping = THREE.LinearToneMapping;
 
-				standardMaterial = new THREE.MeshStandardMaterial( {
-					map: null,
-					color: 0xffffff,
-					metalness: 1.0
-				} );
+			var clock = new THREE.Clock();
+			var container = document.getElementById( 'container' );
 
-				var geometry = new THREE.TorusKnotBufferGeometry( 18, 8, 150, 20 );
-				var torusMesh1 = new THREE.Mesh( geometry, standardMaterial );
-				torusMesh1.position.x = 0.0;
-				torusMesh1.castShadow = true;
-				torusMesh1.receiveShadow = true;
-				scene.add( torusMesh1 );
-				objects.push( torusMesh1 );
+			stats = new Stats();
+			container.appendChild( stats.dom );
 
-				var textureLoader = new THREE.TextureLoader();
-				textureLoader.load( './textures/roughness_map.jpg', function ( map ) {
+			renderer = new THREE.WebGLRenderer( { antialias: true } );
+			renderer.setPixelRatio( window.devicePixelRatio );
+			renderer.setSize( window.innerWidth, window.innerHeight );
+			renderer.toneMapping = THREE.ReinhardToneMapping;
+			container.appendChild( renderer.domElement );
 
-					map.wrapS = THREE.RepeatWrapping;
-					map.wrapT = THREE.RepeatWrapping;
-					map.anisotropy = 4;
-					map.repeat.set( 9, 2 );
-					standardMaterial.roughnessMap = map;
-					standardMaterial.bumpMap = map;
-					standardMaterial.needsUpdate = true;
+			scene = new THREE.Scene();
 
-				} );
+			camera = new THREE.PerspectiveCamera( 40, window.innerWidth / window.innerHeight, 1, 100 );
+			camera.position.set( - 5, 2.5, -3.5 );
+			camera.lookAt( new THREE.Vector3( 0, 0, 0 ) );
 
-				var genCubeUrls = function ( prefix, postfix ) {
+			controls = new THREE.OrbitControls( camera, renderer.domElement );
+			controls.maxPolarAngle = Math.PI * 0.5;
+			controls.minDistance = 0.1;
+			controls.maxDistance = 20;
 
-					return [
-						prefix + 'px' + postfix, prefix + 'nx' + postfix,
-						prefix + 'py' + postfix, prefix + 'ny' + postfix,
-						prefix + 'pz' + postfix, prefix + 'nz' + postfix
-					];
+			scene.add( new THREE.AmbientLight( 0x404040 ) );
 
-				};
+			pointLight = new THREE.PointLight( 0xffffff, 1 );
+			pointLight.position.copy( camera.position );
+			scene.add( pointLight );
 
-				var hdrUrls = genCubeUrls( './textures/cube/pisaHDR/', '.hdr' );
-				new THREE.HDRCubeTextureLoader().load( THREE.UnsignedByteType, hdrUrls, function ( hdrCubeMap ) {
+			var renderScene = new THREE.RenderPass( scene, camera );
 
-					var pmremGenerator = new THREE.PMREMGenerator( hdrCubeMap );
-					pmremGenerator.update( renderer );
+			var bloomPass = new THREE.UnrealBloomPass( new THREE.Vector2( window.innerWidth, window.innerHeight ), 1.5, 0.4, 0.85 ); //1.0, 9, 0.5, 512);
+			bloomPass.renderToScreen = true;
+			bloomPass.threshold = params.bloomThreshold;
+			bloomPass.strength = params.bloomStrength;
+			bloomPass.radius = params.bloomRadius;
 
-					var pmremCubeUVPacker = new THREE.PMREMCubeUVPacker( pmremGenerator.cubeLods );
-					pmremCubeUVPacker.update( renderer );
+			composer = new THREE.EffectComposer( renderer );
+			composer.setSize( window.innerWidth, window.innerHeight );
+			composer.addPass( renderScene );
+			composer.addPass( bloomPass );
 
-					hdrCubeRenderTarget = pmremCubeUVPacker.CubeUVRenderTarget;
+			new THREE.GLTFLoader().load( 'models/gltf/PrimaryIonDrive.glb', function ( gltf ) {
 
-				} );
+				var model = gltf.scene;
 
-				// Lights
+				scene.add( model );
 
-				scene.add( new THREE.AmbientLight( 0xffffff, 0.1 ) );
+				// Mesh contains self-intersecting semi-transparent faces, which display
+				// z-fighting unless depthWrite is disabled.
+				var core = model.getObjectByName( 'geo1_HoloFillDark_0' );
+				core.material.depthWrite = false;
 
-				var spotLight = new THREE.SpotLight( 0xffffff, 1 );
-				spotLight.position.set( 50, 100, 50 );
-				spotLight.angle = Math.PI / 7;
-				spotLight.penumbra = 0.8;
-				spotLight.castShadow = true;
-				scene.add( spotLight );
+				mixer = new THREE.AnimationMixer( model );
+				var clip = gltf.animations[ 0 ];
+				mixer.clipAction( clip.optimize() ).play();
 
-				renderer.setPixelRatio( window.devicePixelRatio );
-				renderer.setSize( window.innerWidth, window.innerHeight );
-				renderer.shadowMap.enabled = true;
-				container.appendChild( renderer.domElement );
+				animate();
 
-				renderScene = new THREE.RenderPass( scene, camera );
+			} );
 
-				effectFXAA = new THREE.ShaderPass( THREE.FXAAShader );
-				effectFXAA.uniforms[ 'resolution' ].value.set( 1 / window.innerWidth, 1 / window.innerHeight );
+			var gui = new dat.GUI();
 
-				bloomPass = new THREE.UnrealBloomPass( new THREE.Vector2( window.innerWidth, window.innerHeight ), 1.5, 0.4, 0.85 ); //1.0, 9, 0.5, 512);
-				bloomPass.renderToScreen = true;
+			gui.add( params, 'exposure', 0.1, 2 );
 
-				composer = new THREE.EffectComposer( renderer );
-				composer.setSize( window.innerWidth, window.innerHeight );
-				composer.addPass( renderScene );
-				composer.addPass( effectFXAA );
-				composer.addPass( bloomPass );
+			gui.add( params, 'bloomThreshold', 0.0, 1.0 ).onChange( function ( value ) {
 
-				renderer.gammaInput = true;
-				renderer.gammaOutput = true;
+				bloomPass.threshold = Number( value );
 
-				stats = new Stats();
-				container.appendChild( stats.dom );
+			} );
 
-				controls = new THREE.OrbitControls( camera, renderer.domElement );
-				controls.minDistance = 50;
-				controls.maxDistance = 200;
+			gui.add( params, 'bloomStrength', 0.0, 3.0 ).onChange( function ( value ) {
 
-				window.addEventListener( 'resize', onWindowResize, false );
+				bloomPass.strength = Number( value );
 
-				var gui = new dat.GUI();
+			} );
 
-				gui.add( params, 'exposure', 0.1, 2 );
+			gui.add( params, 'bloomRadius', 0.0, 1.0 ).step( 0.01 ).onChange( function ( value ) {
 
-				gui.add( params, 'bloomThreshold', 0.0, 1.0 ).onChange( function ( value ) {
+				bloomPass.radius = Number( value );
 
-					bloomPass.threshold = Number( value );
+			} );
 
-				} );
-
-				gui.add( params, 'bloomStrength', 0.0, 3.0 ).onChange( function ( value ) {
-
-					bloomPass.strength = Number( value );
-
-				} );
-
-				gui.add( params, 'bloomRadius', 0.0, 1.0 ).onChange( function ( value ) {
-
-					bloomPass.radius = Number( value );
-
-				} );
-
-				gui.open();
-
-			}
-
-			function onWindowResize() {
+			window.onresize = function () {
 
 				var width = window.innerWidth;
 				var height = window.innerHeight;
@@ -227,61 +170,32 @@
 
 				renderer.setSize( width, height );
 				composer.setSize( width, height );
-				effectFXAA.uniforms[ 'resolution' ].value.set( 1 / window.innerWidth, 1 / window.innerHeight );
 
-			}
+			};
 
-			//
 
 			function animate() {
 
 				requestAnimationFrame( animate );
 
-				stats.begin();
-				render();
-				stats.end();
-
-			}
+				const delta = clock.getDelta();
 
-			function render() {
+				mixer.update( delta );
+				controls.update( delta );
 
-				if ( standardMaterial !== undefined ) {
+				pointLight.position.copy( camera.position );
 
-					standardMaterial.roughness = 1.0;
-					standardMaterial.bumpScale = 0.25;
-
-					var newEnvMap = standardMaterial.envMap;
-
-					if ( hdrCubeRenderTarget ) newEnvMap = hdrCubeRenderTarget.texture;
-
-					if ( newEnvMap !== standardMaterial.envMap ) {
-
-						standardMaterial.envMap = newEnvMap;
-						standardMaterial.envMapIntensity = 1;
-						standardMaterial.needsUpdate = true;
-
-					}
-
-				}
+				stats.update();
 
 				renderer.toneMappingExposure = Math.pow( params.exposure, 4.0 );
 
-				var timer = Date.now() * 0.00025;
-
-				camera.lookAt( scene.position );
-
-				for ( var i = 0, l = objects.length; i < l; i ++ ) {
-
-					var object = objects[ i ];
-					object.rotation.y += 0.005;
-
-				}
-
 				composer.render();
 
 			}
 
+
 		</script>
 
 	</body>
+
 </html>
