Art assets for 2D and immersive apps

Art assets, along with audio, fonts and icons, and lighting and effects, enhance visual appeal. They shape the appearance, aesthetics, and user emotions in your app, guided by your art direction. High-quality assets build a cohesive virtual space, while poorly designed, sourced, or unoptimized assets—such as images, textures, models/objects, and effects—risk reducing immersion and performance. This topic introduces developers for Meta Quest headsets to the art assets needed for their applications.

Two of the most common art assets that you will encounter when developing for a headset are 2D and 3D assets.

2D art assets are flat, two-dimensional graphics and can include panels, splash screens, icons, buttons, images, user interfaces, character sprites, or immersive 2D elements. They can be static or animated and are often used in conjunction with 3D assets, such as with textures and materials.

These assets can be used to enhance the visual appeal of the experience and provide additional information to the user. For example, the grainy bark texture on a tree, backgrounds or skyboxes, 2D characters, decorations like paintings, posters, or signs, and interactive elements like a glowing button in a VR menu. They are also essential for displaying information such as scores, health, and text fields for instructions, as well as for special effects like explosions, fire, and smoke.

Tools like Adobe Photoshop, GIMP, or Canva are commonly used to create 2D images. Generative AI image making tools, like Meta AI⁠, can also be used to create 2D images that can be used as in-app 2D assets. They can be stored in various file formats such as PNG, JPEG, GIF, or SVG, and are typically rendered and displayed in 3D space on primitive shapes, such as a quad, a plane, a billboard (which is a 2D plane that always faces the camera), a panel, or a 2D character (called a sprite). These primitive shapes are often built-in to the engine, such as Unity or Unreal, allowing images to be dragged and dropped into scenes or plugged into a material editor.

3D models are digital representations of objects. A simple primitive 3D model, like a cube, consists of many polygons that form its mesh.

A mesh is a collection of connected pieces that shape the represented objects’ geometry. These parts include:

3D models create objects, characters, and environments, bringing life to virtual spaces and can be enhanced with input modalities to create interactive user experiences.

3D art assets are created using a variety of software tools. They can be static or animated, and are created using 3D modeling software like Blender, Maya, or 3ds Max, and stored in various file formats such as OBJ, FBX, and STL. They are often created outside of developer engine environments and imported into a scene. See Spatial SDK Runtime guidelines for performance limits when using Meta Spatial SDK or get more tips on balancing art and performance. In addition to traditional 3D modeling techniques, generative AI can also be used to create 3D models from 2D images or text. The use of generative AI to create 3D models is an evolving area of research and development.

UVs, textures, and materials are crucial for 3D art assets, enhancing their visual appeal and creating immersive environments.

UVs are 2D representations of a 3D model’s surface. “U” and “V” are the coordinates used to map a 2D texture onto a 3D model. “U” represents the horizontal axis, and “V” represents the vertical axis. UVs ensure textures align with the model’s geometry by defining how a 2D texture maps onto a 3D model’s surface, specifying each vertex’s coordinates on the texture map. This ensures textures apply correctly, displaying detailed patterns on complex shapes.

Textures are images applied to a 3D model’s surface. They create effects ranging from simple color variations to complex patterns. Textures are essential for enhancing a model’s visual appeal, using UV coordinates to map 2D images onto 3D surfaces. They add detailed patterns, colors, and visual effects, contributing to the model’s overall immersion without the need to add additional 3D geometry.

Materials define a 3D model’s surface properties, such as color, reflectivity, and transparency. They create effects from simple colors to complex textures and patterns. Materials are vital for enhancing a model’s visual appearance and immersion, determining how it interacts with light and other elements in an application.

Tools like Adobe Photoshop, GIMP, or Canva are commonly used to create 2D images that can be used as textures and plugged into a standard shader, like a PBR (Physical Based Rendering) shader. Generative AI image making tools, like Meta AI⁠ can also be used to create 2D images that could be used as textures. Tools like Substance Painter can be used to digitally paint textures and materials directly onto imported 3D models, which can then be exported into a developer engine. Keep in mind best practices for textures as texture resolution can be a major factor in drops in performance. For example, if you are using Meta Spatial SDK, limit .gltf textures to 1024x1024 for best performance. See Next steps for links to more docs on art assets and performance.

For more information on content guidelines and store policy concerning art assets see:

Explore more design guidelines and learn how to design great experiences for your app users:

For technical information, start from these development guidelines: