Model · London shopfronts
Shop awning, striped
The striped shop awning is a wide street-level fitting from the London shopfronts pack, about 4.60 m wide, 0.52 m tall and 1.38 m deep, with one unit equal to one metre. It is used in three assemblies: Corner cafe, Shopping parade and Restaurant front. Three named material slots, awning fabric, sign lettering and shop aluminium, let you recolour the fabric, lettering and frame separately. It has no textures, only PBR colour slots with UV mapping.
Triangle counts are 300 at high, 252 at medium and 228 at low, a narrow range, so switching levels saves little; the high level costs little to begin with. The model is safe to instance with InstancedMesh. A plain awning is also in the pack, as are the shop door, fascias and pavement A-board.
A component from the London shopfronts pack, with named material slots for awning fabric, sign lettering and shop aluminium. It measures about 4.60 m × 0.52 m × 1.38 m (W × H × D) and comes as high, medium and low detail files. Place it on its own, or load one of the 10 included assemblies that use it.
The picture is a studio render. View in 3D loads the GLB files themselves in three.js; switch between high, medium and low to compare.
Included in London shopfronts (£19), which contains 34 component models and 4 assemblies.
See the pack| High detail | 300 triangles · 9 KB |
|---|---|
| Medium detail | 252 triangles · 8 KB |
| Low detail | 228 triangles · 8 KB |
| Size (W × H × D) | 4.60 m × 0.52 m × 1.38 m |
| Format | GLB (glTF 2.0 binary) |
| Compression | Meshopt (EXT_meshopt_compression) + quantised; uncompressed copy in the pack |
| Textures | None: PBR colours only, UV-mapped for your own |
| Material slots | awning fabric, sign lettering, shop aluminium |
| Sockets | mount-origin |
| Era | victorian, contemporary |
| On mobile | Start with the low level (228 triangles). What a phone can draw depends on your whole scene; no device benchmark is published yet. |
| Instancing | Safe to instance (InstancedMesh) |
Load it in three.js
import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
import { MeshoptDecoder } from 'three/addons/libs/meshopt_decoder.module.js';
const loader = new GLTFLoader().setMeshoptDecoder(MeshoptDecoder);
const { scene: model } = await loader.loadAsync('models/london-shopfronts-awning-striped/high-london-shopfronts-awning-striped.glb');
scene.add(model); // 1 unit = 1 metre, origin at the mount socket
