10 december 2025

Maak kennis met 3D in Hana

3D en 2D samengebracht

Heel lang vond het grootste deel van het designproces plaats op een 2D-canvas.

De historische scheiding tussen 2D en 3D heeft technische oorzaken. 2D-designtools ontwikkelden zich tot tools die zowel realtime als van hoge kwaliteit zijn (wat je ziet is wat je krijgt), maar 3D vraagt veel meer rekenkracht, waardoor realtime werken alleen mogelijk was met een lagere kwaliteit.

Maar de technologie is flink vooruitgegaan (zowel hardware als software), en ons team heeft de afgelopen jaren grote stappen gezet. Daardoor hebben we een fundamentele mijlpaal bereikt: 3D en 2D in realtime combineren op hetzelfde canvas.

Beweeg je muis of tik om te interacteren (ervaring gemaakt met Hana)

3D en 2D komen samen

We vinden dat een designcanvas alle beschikbare dimensies moet benutten, en dat de gebruiker (mens of AI-agent) moet kunnen kiezen wat het beste past bij de oplossing.

Helaas: in theorie werkt dat, maar iets in 3D implementeren is een technische nachtmerrie, en de twee systemen combineren maakt het nog erger.

De meeste huidige of traditionele designtools zijn op een vergelijkbare manier gebouwd: je werkt aan een preview, drukt dan op "render" of draagt je werk over, en iemand anders bouwt het echte product met een andere stack.

Met andere woorden: bijna geen enkele huidige designtool is realtime, en dus vraagt 3D meestal om gespecialiseerde tools waarvan de output uiteindelijk als platte afbeeldingen of video’s wordt verwerkt of ingesloten: niet bewerkbaar en niet interactief. Dat is een traag proces dat niet past bij de huidige standaarden voor designworkflows.

Om dit te veranderen is een nieuwe aanpak nodig.

Ervaringen gemaakt met Hana

Realtime is het fundament

Toen we Hana bouwden, zorgden we ervoor dat het realtime is en tegelijk alles kan renderen wat je in 2D kunt renderen. De renderer van Hana kan dus allerlei pixelperfecte effecten aan (zoals schaduwen en blur), vectorvormen, booleans en meer, allemaal in realtime.

Dat betekent dat we de effectenpipeline van Hana ook kunnen gebruiken om 3D-graphics in realtime te renderen.

Kortom: Hana kan 3D en 2D volledig combineren.

Vectoren die met Hana realtime 3D worden

Twee werelden samenbrengen

3D toevoegen aan een 2D-canvas lijkt makkelijk, maar in werkelijkheid zijn er talloze uitdagingen. Meestal moet je twee renderers tegelijk draaien of meerdere runtimes combineren, wat leidt tot lange downloadtijden die niet ideaal zijn.

Hana gebruikt dezelfde runtime voor 3D en 2D, wat efficiënter is en veel flexibeler.

Een ander centraal probleem is kwaliteit, of eigenlijk het gebrek daaraan.

De twee systemen samenvoegen tot één en daarbij dezelfde kwaliteit behouden is lastig, omdat kwaliteit in 3D uit meerdere factoren bestaat: anti-aliasing, resolutie, het aantal polygonen (of een hoge voxeldichtheid), het aantal objecten en meer.

In Hana kun je elke 2D-vorm maken en omzetten in een 3D-object, met behoud van een realtime koppeling met de oorspronkelijke vorm.

Je kunt de oorspronkelijke vorm dus op elk moment aanpassen, en het 3D-object wordt dan in realtime opnieuw gegenereerd op basis van die vorm.

Dat levert een flinke productiviteitswinst op als je 3D maakt binnen een 2D-compositie. Je maakt bijvoorbeeld eenvoudig 3D-tekst en verandert de kleur, het lettertype of andere eigenschappen, met behoud van alle flexibiliteit van tekst in een niet-destructieve workflow.

Layouts kunnen dynamisch worden bijgewerkt, en de 3D-objecten volgen de regels van de 2D-compositie.

Ervaringen gemaakt met 3D Shapes in Hana

3D volgt 2D

In Hana heeft elk 3D-object zijn eigen coördinatenstelsel. Toch volgt het de regels en het gedrag van het 2D-canvas, wat betekent dat je alles wat je normaal op 2D-objecten gebruikt ook op 3D-objecten kunt toepassen.

Dat opent de deur naar een breed scala aan designmogelijkheden.