Blend4Web is a

free Free may refer to: Concept * Freedom, having the ability to do something, without having to obey anyone/anything * Freethought, a position that beliefs should be formed only on the basis of logic, reason, and empiricism * Emancipate, to procur ...

and

open source Open source is source code that is made freely available for possible modification and redistribution. Products include permission to use the source code, design documents, or content of the product. The open-source model is a decentralized sof ...

framework for creating and displaying

interactive Across the many fields concerned with interactivity, including information science, computer science, human-computer interaction, communication, and industrial design, there is little agreement over the meaning of the term "interactivity", but m ...

3D computer graphics 3D computer graphics, or “3D graphics,” sometimes called CGI, 3D-CGI or three-dimensional computer graphics are graphics that use a three-dimensional representation of geometric data (often Cartesian) that is stored in the computer for t ...

web browser A web browser is application software for accessing websites. When a user requests a web page from a particular website, the browser retrieves its files from a web server and then displays the page on the user's screen. Browsers are used on ...

Overview

The Blend4Web framework leverages

Blender A blender (sometimes called a mixer or liquidiser in British English) is a kitchen and laboratory appliance used to mix, crush, purée or emulsify food and other substances. A stationary blender consists of a blender container with a rotating me ...

to edit 3D scenes. Content rendering relies on WebGL,

Web Audio HTML5 Audio is a subject of the HTML5 specification, incorporating audio input, playback, and synthesis, as well as speech to text, in the browser. <audio> element The element represents a sound, or an audio stream. It is commonly use ...

WebVR WebXR Device API is a Web application programming interface (API) that describes support for accessing augmented reality and virtual reality devices, such as the HTC Vive, Oculus Rift, Oculus Quest, Google Cardboard, HoloLens, Magic Leap or Ope ...

, and other

web standards Web standards are the formal, non-proprietary standards and other technical specifications that define and describe aspects of the World Wide Web. In recent years, the term has been more frequently associated with the trend of endorsing a set of s ...

, without the use of plug-ins. It is

dual-licensed Multi-licensing is the practice of distributing software under two or more different sets of terms and conditions. This may mean multiple different software licenses or sets of licenses. Prefixes may be used to indicate the number of licenses ...

and is distributed under the

and

GPLv3 The GNU General Public License (GNU GPL or simply GPL) is a series of widely used free software licenses that guarantee end users the four freedoms to run, study, share, and modify the software. The license was the first copyleft for general u ...

and a non-free license; the

source code In computing, source code, or simply code, is any collection of code, with or without comment (computer programming), comments, written using a human-readable programming language, usually as plain text. The source code of a Computer program, p ...

is hosted on

GitHub GitHub, Inc. () is an Internet hosting service for software development and version control using Git. It provides the distributed version control of Git plus access control, bug tracking, software feature requests, task management, co ...

. A 3D scene can be prepared in Blender and then exported as a pair of

JSON JSON (JavaScript Object Notation, pronounced ; also ) is an open standard file format and data interchange format that uses human-readable text to store and transmit data objects consisting of attribute–value pairs and arrays (or other s ...

and binary files to load in a

web application A web application (or web app) is application software that is accessed using a web browser. Web applications are delivered on the World Wide Web to users with an active network connection. History In earlier computing models like client-serve ...

. It can also be exported as a single, self-contained

HTML The HyperText Markup Language or HTML is the standard markup language for documents designed to be displayed in a web browser. It can be assisted by technologies such as Cascading Style Sheets (CSS) and scripting languages such as JavaScri ...

file, in which exported data, the web player GUI and the engine itself are packed.Прахов, Андрей (Июль, 2015). "Blend4Web". ''Linux Format'', стр. 20. The HTML option is considered to be the simplest way. The resulting file, which has a minimum size of 1 MB, can be embedded in a web page using a standard iframe

HTML element An HTML element is a type of HTML (HyperText Markup Language) document component, one of several types of HTML nodes (there are also text nodes, comment nodes and others). The first used version of HTML was written by Tim Berners-Lee in 1993 ...

. Blend4Web-powered web applications can be deployed on

social networking A social network is a social structure made up of a set of social actors (such as individuals or organizations), sets of dyadic ties, and other social interactions between actors. The social network perspective provides a set of methods for a ...

websites such as

Facebook Facebook is an online social media and social networking service owned by American company Meta Platforms. Founded in 2004 by Mark Zuckerberg with fellow Harvard College students and roommates Eduardo Saverin, Andrew McCollum, Dustin ...

. The Blend4Web

toolchain In software, a toolchain is a set of programming tools that is used to perform a complex software development task or to create a software product, which is typically another computer program or a set of related programs. In general, the tools for ...

consists of

JavaScript libraries A JavaScript library is a library of pre-written JavaScript code that allows for easier development of JavaScript-based applications, especially for AJAX and other web-centric technologies. Libraries With the expanded demands for JavaScript, an e ...

, the Blender add-on, and a set of tools for tweaking 3D scene parameters,

debugging In computer programming and software development, debugging is the process of finding and resolving ''bugs'' (defects or problems that prevent correct operation) within computer programs, software, or systems. Debugging tactics can involve in ...

, and

optimization Mathematical optimization (alternatively spelled ''optimisation'') or mathematical programming is the selection of a best element, with regard to some criterion, from some set of available alternatives. It is generally divided into two subfi ...

. Developed by

Moscow Moscow ( , US chiefly ; rus, links=no, Москва, r=Moskva, p=mɐskˈva, a=Москва.ogg) is the capital and largest city of Russia. The city stands on the Moskva River in Central Russia, with a population estimated at 13.0 million ...

-based company Triumph in 2010, Blend4Web was publicly released on March 28, 2014. At the end of 2017, the project founders Yuri and Alex Kovelenov quit Triumph to start the development of a new WebGL framework

Verge3D Verge3D is a real-time renderer and a toolkit used for creating interactive 3D experiences running on websites. Overview Verge3D enables users to convert content from 3D modelling tools (Autodesk 3ds Max and Blender are currently supported) to ...

. In October 2019, an "Absolutely new Blend4Web" was announced, planned to make developing 3D apps easier and to add a new marketplace where people can offer their 3D models.

Features

The framework has a number of components typically found in

game engine A game engine is a software framework primarily designed for the development of video games and generally includes relevant libraries and support programs. The "engine" terminology is similar to the term " software engine" used in the softwar ...

s, including a positional audio system,

physics engine A physics engine is computer software that provides an approximate simulation of certain physical systems, such as rigid body dynamics (including collision detection), soft body dynamics, and fluid dynamics, of use in the domains of computer ...

fork In cutlery or kitchenware, a fork (from la, furca ' pitchfork') is a utensil, now usually made of metal, whose long handle terminates in a head that branches into several narrow and often slightly curved tines with which one can spear foods ...

Bullet A bullet is a kinetic projectile, a component of firearm ammunition that is shot from a gun barrel. Bullets are made of a variety of materials, such as copper, lead, steel, polymer, rubber and even wax. Bullets are made in various shapes and ...

ported to

JavaScript JavaScript (), often abbreviated as JS, is a programming language that is one of the core technologies of the World Wide Web, alongside HTML and CSS. As of 2022, 98% of Website, websites use JavaScript on the Client (computing), client side ...

), animation system, and an

abstraction Abstraction in its main sense is a conceptual process wherein general rules and concepts are derived from the usage and classification of specific examples, literal ("real" or " concrete") signifiers, first principles, or other methods. "An a ...

layer for game logic programming. Up to 8 different types of animations can be assigned to a single object, including

skeletal A skeleton is the structural frame that supports the body of an animal. There are several types of skeletons, including the exoskeleton, which is the stable outer shell of an organism, the endoskeleton, which forms the support structure inside ...

and per-vertex animation. The speed and the direction of animation (forward/backward play), as well as particle system parameters (size, initial velocity, and count), can be changed through the API. Among other supported features are scene data dynamic loading and unloading, subsurface scattering simulation, and image-based lighting. Some out-of-box options exist for rendering extended outdoor environments, including foliage-wind interaction, water, atmosphere, and sunlight simulation. One example demonstrating these effects is "The Farm"

tech demo A technology demonstration (or tech demo), also known as demonstrator model, is a prototype, rough example or an otherwise incomplete version of a conceivable product or future system, put together as proof of concept with the primary purpose of ...

, which also features multiple animated NPCs and the ability to walk, interact with objects and drive a vehicle in first-person mode. Being based on the cross-browser WebGL API, Blend4Web runs in the majority of

s, including mobile ones. There are some caveats for browsers with experimental WebGL support, such as

Internet Explorer Internet Explorer (formerly Microsoft Internet Explorer and Windows Internet Explorer, commonly abbreviated IE or MSIE) is a series of graphical user interface, graphical web browsers developed by Microsoft which was used in the Microsoft Wind ...

. There are also applications developed to run on

Tizen Tizen () is a Linux-based mobile operating system backed by the Linux Foundation, mainly developed and used primarily by Samsung Electronics. The project was originally conceived as an HTML5-based platform for mobile devices to succeed MeeGo ...

-powered devices such as the Samsung Gear S2 smartwatch. Other features include draw call batching, hidden surface determination, threaded

physics simulation Dynamical simulation, in computational physics, is the simulation of systems of objects that are free to move, usually in three dimensions according to Newton's laws of dynamics, or approximations thereof. Dynamical simulation is used in computer ...

and ocean simulation.Cozzi, Patrick. ''WebGL Insights''. CRC Press, 2015 . In version 14.09, Blend4Web introduced the possibility of adding interactivity to 3D scenes using a visual programming tool. The tool is reminiscent of the BGE's logic editor as it uses logic blocks that are placed inside Blender. It plays back animation tracks authored by an artist when the user interacts with predefined 3D objects. Since version 15.03, Blend4Web has supported attaching HTML elements (such as information windows) to 3D objects ("annotations") and copying objects in run time ("instancing"). The following post-processing effects are supported: glow,

bloom Bloom or blooming may refer to: Science and technology Biology * Bloom, one or more flowers on a flowering plant * Algal bloom, a rapid increase or accumulation in the population of algae in an aquatic system * Jellyfish bloom, a collective n ...

depth of field The depth of field (DOF) is the distance between the nearest and the furthest objects that are in acceptably sharp focus in an image captured with a camera. Factors affecting depth of field For cameras that can only focus on one object di ...

crepuscular rays Crepuscular rays are sunbeams that originate when the Sun is just below the horizon, during the twilight period. Crepuscular rays are noticeable when the contrast between light and dark is most obvious. Crepuscular comes from the Latin word ...

motion blur Motion blur is the apparent streaking of moving objects in a photograph or a sequence of frames, such as a film or animation. It results when the image being recorded changes during the recording of a single exposure, due to rapid movement or ...

, and screen space ambient occlusion.

Virtual reality and augmented reality

Virtual reality Virtual reality (VR) is a simulated experience that employs pose tracking and 3D near-eye displays to give the user an immersive feel of a virtual world. Applications of virtual reality include entertainment (particularly video games), e ...

devices have been supported since the end of 2015. Specifically,

Oculus Rift Oculus Rift is a discontinued line of virtual reality headsets developed and manufactured by Oculus VR, a division of Meta Platforms, released on March 28, 2016. In 2012 Oculus initiated a Kickstarter campaign to fund the Rift's development, a ...

head-mounted display A head-mounted display (HMD) is a display device, worn on the head or as part of a helmet (see Helmet-mounted display for aviation applications), that has a small display optic in front of one ( monocular HMD) or each eye (binocular HMD). An ...

works over experimental

API. The software also now includes preliminary support for

gamepad A gamepad is a type of video game controller held in two hands, where the fingers (especially thumbs) are used to provide input. They are typically the main input device for video game consoles. Features Gamepads generally feature a set of ...

s, based on the Gamepad API. In 2017, the option to author

augmented reality Augmented reality (AR) is an interactive experience that combines the real world and computer-generated content. The content can span multiple sensory Modality (human–computer interaction), modalities, including visual, Hearing, auditory, hap ...

content was added. The system is based on the open-source tracking library ARToolKit and uses the

WebRTC WebRTC (Web Real-Time Communication) is a free and open-source project providing web browsers and mobile applications with real-time communication (RTC) via application programming interfaces (APIs). It allows audio and video communication to ...

protocols. Starting from version 17.08,

finger tracking In the field of gesture recognition and image processing, finger tracking is a high-resolution technique developed in 1969 that is employed to know the consecutive position of the fingers of the user and hence represent objects in 3D. In additio ...

is supported through the Leap Motion device.

Blender integration

The Blender add-on is written in Python and C and can be compiled for the

Linux Linux ( or ) is a family of open-source Unix-like operating systems based on the Linux kernel, an operating system kernel first released on September 17, 1991, by Linus Torvalds. Linux is typically packaged as a Linux distribution, which i ...

x86/x64,

OS X macOS (; previously OS X and originally Mac OS X) is a Unix operating system developed and marketed by Apple Inc. since 2001. It is the primary operating system for Apple's Mac computers. Within the market of desktop and la ...

x64, and

MS Windows Windows is a group of several proprietary graphical operating system families developed and marketed by Microsoft. Each family caters to a certain sector of the computing industry. For example, Windows NT for consumers, Windows Server for serv ...

x86/x64 platforms. A Blend4Web-specific profile can be activated in the add-on settings. When switching to this profile, the Blender interface changes so that it only reveals settings relevant to Blend4Web. Blend4Web supports a set of Blender-specific features such as the node material editor (a tool for visual

shader In computer graphics, a shader is a computer program that calculates the appropriate levels of light, darkness, and color during the rendering of a 3D scene - a process known as '' shading''. Shaders have evolved to perform a variety of spec ...

programming) and the particle system. There is basic support for Blender's non-linear animation (NLA) editor for creating simple scenarios. Blend4Web is based on Blender's real-time

GLSL OpenGL Shading Language (GLSL) is a high-level shading language with a syntax based on the C programming language. It was created by the OpenGL ARB (OpenGL Architecture Review Board) to give developers more direct control of the graphics pip ...

rendering engine, which users are recommended to use in order to enable

WYSIWYG In computing, WYSIWYG ( ), an acronym for What You See Is What You Get, is a system in which editing software allows content to be edited in a form that resembles its appearance when printed or displayed as a finished product, such as a printed d ...

editing.

Notable uses

NASA The National Aeronautics and Space Administration (NASA ) is an independent agency of the US federal government responsible for the civil space program, aeronautics research, and space research. NASA was established in 1958, succeedi ...

developed an interactive web application called

Experience Curiosity Experience Curiosity is an interactive web application developed by NASA's Jet Propulsion Laboratory to celebrate the third anniversary of the ''Curiosity'' rover landing on Mars. This 3D serious game makes it possible to operate the rover, control ...

to celebrate the 3rd anniversary of the

Curiosity rover ''Curiosity'' is a car-sized Mars rover designed to explore the Gale crater on Mars as part of NASA's Mars Science Laboratory (MSL) mission. ''Curiosity'' was launched from Cape Canaveral (CCAFS) on November 26, 2011, at 15:02:00 UTC and ...

landing on

Mars Mars is the fourth planet from the Sun and the second-smallest planet in the Solar System, only being larger than Mercury. In the English language, Mars is named for the Roman god of war. Mars is a terrestrial planet with a thin atmos ...

. This Blend4Web-based app makes it possible to operate the rover, control its cameras and the

robotic arm A robotic arm is a type of mechanical arm, usually programmable, with similar functions to a human arm; the arm may be the sum total of the mechanism or may be part of a more complex robot. The links of such a manipulator are connected by join ...

, and reproduce some of the prominent events of the

Mars Science Laboratory Mars Science Laboratory (MSL) is a robotic space probe mission to Mars launched by NASA on November 26, 2011, which successfully landed ''Curiosity'', a Mars rover, in Gale Crater on August 6, 2012. The overall objectives include investigati ...

mission. The application got presented at the beginning of the WebGL section at

SIGGRAPH SIGGRAPH (Special Interest Group on Computer Graphics and Interactive Techniques) is an annual conference on computer graphics (CG) organized by the ACM SIGGRAPH, starting in 1974. The main conference is held in North America; SIGGRAPH Asia ...

2015.

was ported to

for Blender in 2018 with several performance improvements and bug fixes. A General Motors authorized dealer in the

United Arab Emirates The United Arab Emirates (UAE; ar, اَلْإِمَارَات الْعَرَبِيَة الْمُتَحِدَة ), or simply the Emirates ( ar, الِْإمَارَات ), is a country in Western Asia ( The Middle East). It is located at ...

has placed a functional

Chevrolet Camaro The Chevrolet Camaro is a mid-size American automobile manufactured by Chevrolet, classified as a pony car. It first went on sale on September 29, 1966, for the 1967 model year and was designed to compete with the Ford Mustang. The Camaro sh ...

3D configurator on its website.

Greenpeace Greenpeace is an independent global campaigning network, founded in Canada in 1971 by Irving Stowe and Dorothy Stowe, immigrant environmental activists from the United States. Greenpeace states its goal is to "ensure the ability of the Earth ...

created interactive 3D infographics to back Greenpeace's Detox campaign in Russia.

Tallink Tallink () is an Estonian shipping company operating Baltic Sea cruiseferries and ropax ships from Estonia to Finland, Estonia to Sweden to Sweden and Finland to Sweden. It is the largest passenger and cargo shipping company in the Baltic Sea ...

featured an interactive 3D presentation of its MS Megastar vessel to allow visitors to browse details of the ship.

References

External links

* {{DEFAULTSORT:Blend4Web 3D graphics software 3D scenegraph APIs Cross-platform software Free 3D graphics software Game engines for Linux Graphics libraries JavaScript libraries Web development WebGL