View source for Blend4Web

{{Short description|Free open-source framework}}
{{multiple issues|
{{COI|date=April 2019}}
{{advert|date=April 2019}}
}}
{{Infobox software
| logo =
| screenshot =
| caption = Screenshots of Blend4Web demos
| name = Blend4Web
| developer = Triumph LLC
| released = {{Start date and age|2014|03|28}}<ref>{{cite web|url=https://www.blend4web.com/en/about/|title=Blend4Web Official Site - About|publisher=blend4web.com|date=|access-date=2024-06-20}}</ref>
| discontinued = yes
| latest release version = 18.05
| latest release date = {{Start date and age|2018|06|06}}
| programming language = [[JavaScript]], [[Python (programming language)|Python]], [[C (programming language)|C]], [[C++]]
| genre = [[3D engine]]
| license = [[GPLv3]] or [[commercial software|commercial]]
| website = {{URL|https://www.blend4web.com}}
}}
'''Blend4Web''' is a [[Free software|free]] and [[Open-source software|open source]] [[Software framework|framework]] for creating and displaying [[Interactivity|interactive]] [[3D computer graphics]] in [[web browser]]s.
==Overview==
The Blend4Web framework leverages [[Blender (software)|Blender]] to edit 3D scenes. Content rendering relies on [[WebGL]], [[Web audio|Web Audio]], [[WebVR]], and other [[web standards]], without the use of [[Browser extension|plug-ins]].<ref name="hacks_mozilla">{{cite web|url=https://hacks.mozilla.org/2014/10/blend4web-the-open-source-solution-for-online-3d/|title=Blend4Web: the Open Source Solution for Online 3D|publisher=Mozilla Hacks|date=2014-10-07|access-date=2015-08-13}}</ref>
It is [[Multi-licensing|dual-licensed]]. The framework is distributed under the [[Free license|free]] and [[Open-source software|open source]] [[GPLv3]] and, a [[Non-free software|non-free]] license - with the [[source code]] being hosted on [[GitHub]].<ref name="blend4web_github">{{cite web|url=https://github.com/TriumphLLC/Blend4Web|title=Blend4Web on GitHub|publisher=GitHub.com/TriumphLLC|date=|access-date=2014-08-11}}</ref>
A 3D scene can be prepared in Blender and then exported as a pair of [[JSON]] and [[Binary file|binary]] files to load in a [[web application]]. It can also be exported as a single, self-contained [[HTML]] file, in which exported data, the web player [[Graphical user interface|GUI]], and the engine itself are packed.<ref name="linux-format-2015-07">Прахов, Андрей (Июль, 2015). "Blend4Web". ''Linux Format'', стр. 20.</ref> The HTML option is considered to be the simplest way.<ref name="blendernation_review">{{cite web|url=http://www.blendernation.com/2014/07/11/blend4web-an-interactive-3d-viewer/|title=Blend4Web, an Interactive 3D Viewer|publisher=BlenderNation.com|date=11 July 2014|access-date=2014-08-11}}</ref> The resulting file, which has a minimum size of 1 [[Megabyte|MB]], can be embedded in a web page using a standard [[HTML element#Frames|iframe]] [[HTML element]].<ref name="blend4web_belursus">{{cite web|url=http://belursus.info/index.php?c=s-blend4web|title=Blend4Web: способ вставить 3D-содержание на веб-страницу с использованием WebGL|publisher=Belursus.info|date=|access-date=2014-09-04|archive-date=2015-06-26|archive-url=https://web.archive.org/web/20150626210953/http://belursus.info/index.php?c=s-blend4web|url-status=dead|language=ru}}</ref> Blend4Web-powered web applications can be deployed on [[Social networking service|social networking]] websites such as [[Facebook]].<ref name="dalaifelinto">{{cite web|url=http://www.dalaifelinto.com/?p=1078|title=Blender Models in Facebook|publisher=Dalai Felinto|date=2015-09-10|access-date=2015-09-11|archive-date=2016-03-04|archive-url=https://web.archive.org/web/20160304122445/http://www.dalaifelinto.com/?p=1078|url-status=dead}}</ref>
The Blend4Web [[toolchain]] consists of [[JavaScript library|JavaScript libraries]], the Blender [[Plug-in (computing)|add-on]], and a set of tools for [[tweaking]] 3D scene parameters, [[debugging]], and [[Program optimization|optimization]].
Developed by [[Moscow]]-based company Triumph in 2010, Blend4Web was publicly released on March 28, 2014.<ref name="blend4web_com_about">{{cite web|url=https://www.blend4web.com/en/about/|title=Blend4Web Official Site - About|publisher=Blend4Web.com|date=|access-date=2015-08-13}}</ref>
At the end of 2017, the project founders Yuri and Alex Kovelenov quit Triumph to start the development of a new [[WebGL]] framework [[Verge3D]].<ref name="soft8soft">{{cite web|url=https://www.soft8soft.com/starting-up/|title=Starting up|publisher=Soft8Soft|date=5 October 2017|access-date=2017-11-23}}</ref>
In October 2019, an "Absolutely new Blend4Web"<ref>{{Cite web|title=New Blend4Web|url=https://www.blend4web.com/en/community/article/414/|access-date=2021-03-07|website=Blend4Web|language=en|archive-date=2021-02-25|archive-url=https://web.archive.org/web/20210225080032/https://www.blend4web.com/en/community/article/414/|url-status=dead}}</ref> was announced, planned to make developing 3D apps easier and to add a new marketplace where people can offer their [[3D modeling|3D models]].
==Features==
The framework has a number of components typically found in [[game engine]]s, including a [[3D audio effect|positional audio]] system, [[physics engine]] (a [[Fork (software development)|fork]] of [[Bullet (software)|Bullet]] [[Porting|ported]] to [[JavaScript]]), [[Computer animation|animation system]], and an [[Abstraction (computer science)|abstraction]] layer for game logic programming.<ref name="opennet0">{{cite web|url=http://www.opennet.ru/opennews/art.shtml?num=39506|title=Представлен Blend4Web, движок для создания браузерных 3D-приложений|publisher=OpenNet.ru|date=|access-date=2015-06-18}}</ref>
Up to 8 different types of animations can be assigned to a single object, including [[Skeletal animation|skeletal]] and [[Morph target animation|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 [[Application programming interface|API]].<ref name="opennet14.08">{{cite web|url=http://www.opennet.ru/opennews/art.shtml?num=40457|title=Релиз движка для создания браузерных 3D-приложений Blend4Web 14.08|publisher=OpenNet.ru|date=|access-date=2015-08-13}}</ref>
Among other supported features are: scene data [[dynamic loading]] and unloading, [[subsurface scattering]] simulation, and [[image-based lighting]].<ref name="blendernation_release_14_07">{{cite web|url=http://www.blendernation.com/2014/07/25/blend4web-update-adds-improved-lighting-and-more/|title=Blend4Web update adds improved lighting and more|publisher=BlenderNation.com|date= 25 July 2014|access-date=2014-08-13}}</ref>
Some out-of-box options exist for [[Rendering (computer graphics)|rendering]] extended outdoor environments, including foliage-wind interaction, water, atmosphere, and sunlight simulation. One example demonstrating these effects is "The Farm" [[Technology demonstration|tech demo]], which also features multiple animated [[Non-player character|NPCs]] and the ability to walk, interact with objects and drive a vehicle in [[First-person (video games)|first-person]] mode.<ref name="echtvirtuell_farm">{{cite web|url=http://echtvirtuell.blogspot.de/2014/09/blend4web-farm-demo-einer-kleine.html|title=Blend4Web: "The Farm" - Demo einer kleinen virtuellen Welt|publisher=Echt Virtuell|date= 17 September 2014|access-date=2014-09-18}}</ref>
Being based on the [[cross-browser]] WebGL [[Application programming interface|API]], Blend4Web runs in the majority<ref name="caniuse_webgl">{{cite web|url=http://caniuse.com/webgl|title=Can I use WebGL?|publisher=caniuse.com|date=|access-date=2014-08-15}}</ref> of [[web browser]]s, including mobile ones.<ref name="3dspace">{{cite web|url=http://3dspace.com/2016/02/html5-the-3d-web-and-the-death-of-plugins/|title=HTML5, the 3D Web, and the Death of Plugins|publisher=3dspace.com|date=|access-date=2016-02-18|archive-url=https://web.archive.org/web/20160215223613/http://3dspace.com/2016/02/html5-the-3d-web-and-the-death-of-plugins/|archive-date=2016-02-15|url-status=dead}}</ref> There are some caveats for browsers with experimental WebGL support, such as [[Internet Explorer]].<ref name="kaldata">{{cite web|url=https://www.kaldata.com/IT-%D0%9D%D0%BE%D0%B2%D0%B8%D0%BD%D0%B8/Blend4Web-%D0%B5%D0%BD%D0%B4%D0%B6%D0%B8%D0%BD-%D0%B7%D0%B0-%D1%81%D1%8A%D0%B7%D0%B4%D0%B0%D0%B2%D0%B0%D0%BD%D0%B5-%D0%BD%D0%B0-%D0%B1%D1%80%D0%B0%D1%83%D0%B7%D1%8A%D1%80%D0%BD%D0%B8-3D-%D1%81%D1%86%D0%B5-88641.html|title=Blend4Web: енджин за създаване на браузърни 3D сцени и приложения|publisher=Kaldata: Software, Hardware and Game Reviews|date= 7 April 2014|access-date=2014-09-04}}</ref> There are also applications developed to run on [[Tizen]]-powered devices such as the [[Samsung Gear S2]] smartwatch.<ref name="tizenexperts">{{cite web|url=http://www.tizenexperts.com/2016/08/real-time-3d-watchfaces-from-luxury-watches-for-the-gear-s2/|title=Real Time 3D watchfaces from Luxury Watches for the Gear S2|publisher=Tizen Experts|date=|access-date=2016-08-12}}</ref>
Other features include: draw call batching, [[hidden surface determination]], [[Thread (computing)|threaded]] [[Dynamical simulation|physics simulation]] and ocean simulation.<ref name="WebGL_Insights">Cozzi, Patrick. ''WebGL Insights''. CRC Press, 2015 {{ISBN|978-1-49-871607-9}}.</ref>
In version 14.09, Blend4Web introduced the possibility of adding interactivity to 3D scenes using a [[Visual programming language|visual programming]] tool.<ref name="blendernation_release_14_09">{{cite web|url=http://www.blendernation.com/2014/09/29/blend4web-update-non-linear-animation-and-more/|title=Blend4Web Update: Non Linear Animation and more|publisher=BlenderNation.com|date= 29 September 2014|access-date=2014-09-29}}</ref><ref name="digilinux_release_14_09">{{cite web|url=http://digilinux.ru/2014/09/26/blend4web-14-09/|title=Выпущен фреймворк Blend4Web 14.09|publisher=digilinux.ru|date=|access-date=2014-09-29|archive-url=https://web.archive.org/web/20140928073106/http://digilinux.ru/2014/09/26/blend4web-14-09/|archive-date=2014-09-28|url-status=dead}}</ref> The tool is reminiscent of the [[Blender Game Engine|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.<ref name="habrahabr-obzor">{{cite web|url=http://habrahabr.ru/post/259437/|title=Blend4Web: обзор новинки отечественного софтопрома|publisher=Habrahabr.ru|date=3 June 2015|access-date=2015-06-04}}</ref>
Since version 15.03, Blend4Web has supported attaching HTML elements (such as information windows) to 3D objects ("annotations") and copying objects in [[Run time (program lifecycle phase)|run time]] ("instancing").<ref name="benicourt">{{cite web|url=http://www.benicourt.com/blender/2015/04/blend4web-annotations-interactives/|title=Blend4web: annotations interactives et autres nouveautés|publisher=Greg G.d.Bénicourt|date=|access-date=2015-05-29|archive-url=https://web.archive.org/web/20160514011354/http://www.benicourt.com/blender/2015/04/blend4web-annotations-interactives/|archive-date=2016-05-14|url-status=dead}}</ref>
The following [[Video post-processing|post-processing]] effects are supported: glow, [[Bloom (shader effect)|bloom]], [[depth of field]], [[crepuscular rays]], [[motion blur]], and [[screen space ambient occlusion]].<ref name="opennet15.05">{{cite web|url=http://www.opennet.ru/opennews/art.shtml?num=42303|title=Релиз движка для создания браузерных 3D-приложений Blend4Web 15.05|publisher=OpenNet.ru|date=|access-date=2015-06-18}}</ref>
==Virtual reality and augmented reality==
[[Virtual reality]] devices have been supported since the end of 2015. Specifically, [[Oculus Rift]] [[head-mounted display]] works over experimental [[WebVR]] API.<ref name="cgchannel">{{cite web|url=http://www.cgchannel.com/2016/01/triumph-releases-blend4web-15-12/|title=Triumph releases Blend4Web 15.12|publisher= cgchannel.com|date=|access-date=2016-02-18}}</ref>
The software also now includes preliminary support for [[gamepad]]s, based on the Gamepad API.<ref name="cgchannel2">{{cite web|url=http://www.cgchannel.com/2016/09/triumph-releases-blend4web-16-08/|title=Triumph releases Blend4Web 16.08|publisher= cgchannel.com|date=|access-date=2016-09-14}}</ref>
In 2017, the option to author [[augmented reality]] content was added.<ref name="80level">{{cite web|url=https://80.lv/articles/blend4web-17-06-is-out/|title=Blend4Web 17.06 is Out|publisher= 80 Level|date= 7 July 2017|access-date=2017-07-14}}</ref> The system is based on the open-source tracking library [[ARToolKit]] and uses the [[WebRTC]] protocols.<ref name="cgchannel3">{{cite web|url=http://www.cgchannel.com/2017/07/blend4web-17-06-adds-augmented-reality-support/|title=Blend4Web 17.06 adds augmented reality support|publisher= cgchannel.com|date=|access-date=2017-07-14}}</ref>
Starting from version 17.08, [[finger tracking]] is supported through the [[Leap Motion]] device.<ref name="blogr23de">{{cite web|url=https://blog.r23.de/blend4web/|title=Blend4Web|publisher= blog.r23.de|date= 5 September 2017|access-date=2017-09-07}}</ref>
==Blender integration==
The Blender [[Plug-in (computing)|add-on]] is written in [[Python (programming language)|Python]] and [[C (programming language)|C]] and can be compiled for the [[Linux]] x86/x64, [[OS X]] x64, and [[Microsoft Windows|MS Windows]] x86/x64 [[Computing platform|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.<ref name="3ddey">{{cite web|url=http://3ddey.com/blend4web-musthave-for-blenderfans/|title=Blend4Web – Must-Have for Blender Fans!|publisher=3ddey.com|access-date=2015-05-29|url-status=dead|archiveurl=https://web.archive.org/web/20150601044525/http://3ddey.com/blend4web-musthave-for-blenderfans/|archivedate=2015-06-01}}</ref>
Blend4Web supports a set of Blender-specific features such as the node material editor (a tool for visual [[shader]] programming)<ref name="http://3d-magazin.eu/">{{cite web|url=http://3d-magazin.eu/e-commerce/interaktives-3d-web-ist-das-die-zukunft|title=Interactives 3D Web – Ist Das Die Zukunft?|publisher=3d-magazin.eu|date=15 September 2016|access-date=2016-09-16}}</ref> and the [[particle system]].<ref name="entwickler">{{cite web|url=https://entwickler.de/online/frameworks/3d-web-applikationen-mit-blend4web-erstellen-139994.html|title=3D-Web-Applikationen mit Blend4Web erstellen|publisher=entwickler.de|date=|access-date=2015-05-29|archive-date=2016-03-03|archive-url=https://web.archive.org/web/20160303184132/https://entwickler.de/online/frameworks/3d-web-applikationen-mit-blend4web-erstellen-139994.html|url-status=dead}}</ref> 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]] rendering engine, which users are recommended to use in order to enable [[WYSIWYG]] editing.<ref name="blenderlounge">{{cite web|url=http://blenderlounge.fr/blend4web-exporter-facilement-vos-scenes-en-html/|title=Blend4Web: Exporter Facilement en HTML|publisher=BlenderLounge|date=12 July 2015|access-date=2015-07-17}}</ref>
==Notable uses==
[[NASA]] developed an interactive web application called [[Experience Curiosity]] to celebrate the 3rd anniversary of the [[Curiosity (rover)|Curiosity rover]] landing on [[Mars]].<ref name="nasa-press-release">{{cite web|url=http://www.nasa.gov/press-release/new-online-exploring-tools-bring-nasas-journey-to-mars-to-new-generation|title=New Online Exploring Tools Bring NASA's Journey to Mars to New Generation|publisher=NASA|date= 5 August 2015|access-date=2015-08-07}}</ref> This Blend4Web-based app<ref name="curiosity-app">{{cite web|url=http://eyes.nasa.gov/curiosity/|title=Experience Curiosity|publisher=NASA's Eyes|date=|access-date=2015-08-07}}</ref> makes it possible to operate the rover, control its cameras and the [[robotic arm]], and reproduce some of the prominent events of the [[Mars Science Laboratory]] mission.<ref name="benicourt-nasa">{{cite web|url=http://www.benicourt.com/blender/2015/09/prenez-le-controle-de-curiosity-avec-blend4web/|title=Prenez le controle de Curiosity avec Blend4Web|publisher=Greg G.d.Bénicourt|date=|access-date=2015-09-16|archive-url=https://web.archive.org/web/20150919134539/http://www.benicourt.com/blender/2015/09/prenez-le-controle-de-curiosity-avec-blend4web/|archive-date=2015-09-19|url-status=dead}}</ref><ref name="technology-org-nasa-webapp">{{cite web|url=http://www.technology.org/2015/08/11/internet-3d-take-the-curiosity-rover-for-a-spin-right-on-the-nasa-website/|title=Internet 3D: Take the Curiosity Rover for a Spin Right on the NASA Website|publisher=Technology.Org|date= 11 August 2015|access-date=2015-08-12}}</ref> The application got presented at the beginning of the WebGL section at [[SIGGRAPH]] 2015.<ref name="khronos-events-2015-SIGGRAPH">{{cite web|url=https://www.khronos.org/news/events/2015-siggraph|title=Khronos Events - 2015 SIGGRAPH|publisher=Khronos|date= 10 August 2015|access-date=2015-08-13}}</ref>
[[Experience Curiosity]] was ported to [[Verge3D]] for Blender in 2018 with several performance improvements and bug fixes.<ref name="s8s-nasa">{{cite web|url=https://www.soft8soft.com/verge3d-nasa/|title=Experience Curiosity: NASA turns to Verge3D|publisher=Soft8Soft|date= 27 June 2018|access-date=2018-11-03}}</ref>
A [[General Motors]] authorized dealer in the [[United Arab Emirates]] has placed a functional [[Chevrolet Camaro]] 3D configurator on its website.<ref name="benicourt2">{{cite web|url=http://www.benicourt.com/blender/2017/06/blend4web-un-configurateur-pour-chevrolet/|title=BLEND4WEB: UN CONFIGURATEUR POUR CHEVROLET|publisher=benicourt.com|date=|access-date=2017-06-23}}</ref><ref name="alghandi">{{cite web|url=http://chevrolet.alghandi.com/new-vehicles/2017-camaro/|title=Al Ghandi Auto|publisher=Al Ghandi Auto|date=|access-date=2017-06-23}}</ref>
[[Greenpeace]] created interactive 3D infographics to back Greenpeace's Detox campaign in Russia.<ref name="greenpeace">{{cite web|url=http://www.greenpeace.org/russia/ru/campaigns/water-pollution/detox/|title=Чистая мода - Гринпис России|publisher=Greenpeace|date=|access-date=2016-09-14|archive-date=2016-10-03|archive-url=https://web.archive.org/web/20161003210431/http://www.greenpeace.org/russia/ru/campaigns/water-pollution/detox/|url-status=dead}}</ref> [[Tallink]] featured an interactive 3D presentation of its [[MS Megastar]] vessel to allow visitors to browse details of the ship.<ref name="tallink">{{cite web|url=http://megastar.tallink.com/3d-experience/|title=Megastar 3D Experience|publisher=Tallink|date=|access-date=2016-09-14|language=fi}}</ref>
==See also==
{{Portal|Free and open-source software}}
* [[Verge3D]]
* [[Blender (software)|Blender]]
* [[WebGL]]
* [[List of WebGL frameworks]]
==References==
{{Reflist|30em}}
==External links==
* {{Official website}}
{{DEFAULTSORT:Blend4Web}}
[[Category:3D graphics software]]
[[Category:3D scenegraph APIs]]
[[Category:Cross-platform software]]
[[Category:Free 3D graphics software]]
[[Category:Game engines for Linux]]
[[Category:Graphics libraries]]
[[Category:JavaScript libraries]]
[[Category:Web development]]
[[Category:WebGL]]