Skip to documentation

01.05

What is a .visu file?

Browse What, Why & Who
  1. What is Visu.Haus?
  2. What can you create with Visu.Haus?
  3. Who is Visu.Haus for?
  4. Why choose Visu.Haus?
  5. What is a .visu file?

A .visu file is the portable, editable project format used by Visu.Haus. It stores the complete visual system, not only the image currently visible on the canvas.

Technically, a .visu is a structured project file. Inside it, Visu.Haus stores the code that creates the visual together with its controls, assets, effects, animation, and project settings.

Keeping the .visu file allows you to continue editing, create new variations, move the project between computers, share it with someone else, or keep a local backup.

What a .visu contains#

Depending on the project, a .visu file can contain:

  • The complete HTML, CSS, and JavaScript code that creates and runs the visual
  • Shader code and rendering logic when WebGL or WebGPU is used
  • Definitions for every available control
  • The current values of colors, speed, scale, density, typography, distortion, and other parameters
  • Images, image collections, videos, audio, SVGs, and 3D models
  • Text and media overlays
  • Effects and their settings
  • Timeline tracks and keyframes
  • Embedded fonts and typography settings
  • Canvas size, aspect ratio, resolution, and background settings
  • The original prompt and project information
  • Previous versions and generation history

The code stored inside the file controls how the visu looks, moves, responds, and interacts. The remaining project data tells Visu.Haus how to present that code as an editable tool.

Some assets and fonts can be embedded directly in the file. Other projects may refer to external libraries or media and require an internet connection when opened.

Built with web technologies#

Visus are built with the same technologies used to create interactive experiences on the web. They run live in the browser and do not require a traditional video render before you can see or control them.

A visu is not restricted to a single rendering technology. Depending on the project, its code may use:

Technology Common uses
HTML, CSS, and DOM Interface-like compositions, typography, layouts, and structured elements
SVG Vector graphics, logos, paths, masks, and scalable shape animation
Canvas 2D or p5.js Graphic systems, illustration, particles, typography, paper, ink, and pixel-based visuals
WebGL2 and GLSL shaders Distortion, liquid effects, gradients, metaballs, noise, glow, image processing, and dense particle systems
WebGPU and WGSL shaders Complex simulations, flow fields, feedback textures, reaction-diffusion, large grids, and multi-pass generative systems
Three.js Stylized, abstract, generative, or lightweight 3D scenes
Babylon.js Realistic 3D objects, physical materials, studio lighting, shadows, glass, metal, and product visualization
Hybrid rendering GPU-rendered visuals combined with editable text, media, SVG, or interface layers

More advanced technology does not automatically create a better visu. The important part is that the chosen approach supports the visual idea, interaction, controls, performance, and required browser compatibility.

The Visu.Haus runtime#

The code is only one part of a .visu. Visu.Haus provides the interface and runtime that turn that code into an editable creative tool.

This environment connects the visual to:

  • Live controls
  • Images, image collections, video, audio, SVGs, and 3D models
  • Pointer, webcam, MIDI, and other supported inputs
  • Typography and font controls
  • Effects and overlays
  • Timeline animation
  • Snapshots and exports
  • Project saving and version history

This connection allows every visual to work inside the Editor without needing to create its own control panel, media uploader, Timeline, asset system, or export interface.

When you change a control in Visu.Haus, the runtime sends the new value to the visual code. The visu responds immediately, without rebuilding the project or waiting for a render.

A project, not an export#

A .visu file is different from a PNG, JPG, SVG, PDF, HTML export, React export, or video.

Those formats capture or package a particular result from the project. They are intended for publishing, sharing, embedding, or continuing production in another application.

The .visu file remains alive and editable. When you open it, the original code runs again with its controls, motion, interactions, effects, assets, and Timeline intact.

If you may need to change the work later, keep the .visu file in addition to any exported images or videos.

Saving and opening a .visu#

You can save a visu to My Visus or download its .visu file to your computer. A downloaded file can be reopened in Visu.Haus, transferred to another computer, shared with a collaborator, or stored as a project backup.

After opening a file on another device, check its fonts, media, controls, and motion. Some technologies may depend on browser and hardware support, while external libraries or assets may require an internet connection.

Open files from sources you trust#

A .visu contains executable web code. Only open files created by you, downloaded from the Visu.Haus Gallery, or received from someone you trust.

Do not rename another file to use the .visu extension. Changing the extension does not convert it into a valid Visu.Haus project.

Something unclear?

Send documentation feedback