Skip to content

An interactive, 3d depiction of a surveillance tech-fueled world

Notifications You must be signed in to change notification settings

amphinomid/luxe

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

84 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

luxe

An exploration of a surveillance tech-fueled present. The name, concept and references in the piece are largely inspired by the work of Chris Gilliard and David Golumbia on what they call "luxury surveillance."

I made the 3d models in Blender over winter break 2021. Winter break of this year (2022) I finally got around to transforming them into a web app. (A lot has changed in a year, but a lot has stayed the same. Last year, I named this project "subtle dystopia"; it was intended to be "an exploration of a surveillance tech-fueled future." But as Gilliard writes about surveillance tech in The Atlantic, "It would be a bit glib—and more than a little clichéd—to call this some kind of technological dystopia. Actually, dystopia wouldn't be right, exactly; Dystopian fiction is generally speculative, whereas all of these items and services are real.") I made the images in the piece in Sketch and used three.js for the web stuff.

  • Takes a few seconds to load <3
  • Use the arrow keys, dragging and pinching/scrolling (zooming) to look around. (Screenshot of the room below~)
  • Photosensitivity warning — the CSS objects sometimes flash when rendering.
  • Alt text for the room: Two adjacent grey walls and a grey floor form a corner. The room is awash with dim red-pink light. Along the wall on the left are a lamp in the shape of a small potted tree plant; a glass table with a speaker, tablet (showing a "doorbell cam"), monitor (showing a "WARNING: CHEATING; Keep your face in view of your webcam" message) and a chair; and a blue light in the shape of a cloud. Along the wall on the right are a lofted bed with a blue blanket and red and green pillows, underneath which are two drawers; a shelf with an icosahedron-shaped lamp, a Rubik's cube, two books and slippers; a TV cycling through three fake ads ("no more bad dates," "NEVER COOK AGAIN" and "SELL YOUR DATA YOUR WAY"); and a mirror with glowing text that reads "body scan mode." In the middle of the room is a blob-shaped rug on which a robotic orange cat stands. Above the two walls are links to this repo and its README.

(If you're trying it on Safari, be sure to go to Menu > Develop > Experimental Features and check WebGL 2.0.)

TODOs / bugs:

  • Loading indicator
  • Safari CSS object offset (possibly relevant: this)
  • Sound randomly stops playing / doesn't work

Inspiration for various parts of the piece:

Credits:

Random notes on process:

  • Created model in Blender with colors, textures, lights, etc.; fiddled with it until it looked nice when rendered
  • Baked textures in groups, by material, following this tutorial
    • 4096x4096, reduce light bounces to speed it up, make sure Image Texture is selected in the shading editor and the dropdown is filled with the relevant image
  • Connected baked textures to corresponding materials in shading editor, exported as .glb
  • Switched to using cdn when deploying
  • The CSS objects render on top of the other objects, which is kind of annoying. Experimented with adding image textures to the screens but it was kind of a hassle. Didn't plan ahead for this, but for future projects do this in Blender (e.g. a lot of the screens are static so there's no need to do them in three.js). (TODO: try to find workaround.)

Two adjacent grey walls and a grey floor form a corner. The room is awash with dim red-pink light. Along the wall on the left are a lamp in the shape of a small potted tree plant; a glass table with a speaker, tablet (showing a "doorbell cam"), monitor (showing a "WARNING: CHEATING; Keep your face in view of your webcam" message) and a chair; and a blue light in the shape of a cloud. Along the wall on the right are a lofted bed with a blue blanket and red and green pillows, underneath which are two drawers; a shelf with an icosahedron-shaped lamp, a Rubik's cube, two books and slippers; a TV cycling through three fake ads ("no more bad dates," "NEVER COOK AGAIN" and "SELL YOUR DATA YOUR WAY"); and a mirror with glowing text that reads "body scan mode." In the middle of the room is a blob-shaped rug on which a robotic orange cat stands. Above the two walls are links to this repo and its README.

About

An interactive, 3d depiction of a surveillance tech-fueled world

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages