User Experience
Take your web apps to the next level with UI/UX tools and real-time collaboration
Develop any user interface, from a simple 2D toolbar to on-screen 3D widgets or gesture-based VR controls, with the Zea UX plugin and Zea Web Components UI library.
Zea Collab lets you interact with, demonstrate, and review your 3D projects collaboratively from anywhere in the world.
Table of Contents
UX and UI
Combine Zea UX and Zea Web Components to create rich user experiences in both 2D and 3D.
- Undo/redo tools.
- On-screen 3D widgets such as translation and rotation tools.
- User-created 3D geometry and 2D splines.
- Quickly assemble UIs with our library of components.
- Develop anything from tree views for model structures through to simple menus.
- Web components library that is compatible with any existing web app framework.
- Annotate models in multiple languages with smart labels.
Real-time Collaboration
With Zea Collab, you can Interact with, demonstrate, and review your 3D projects simultaneously with your team from anywhere in the world.
- Simply share a URL or QR code to invite colleagues to collaborate.
- Collaborate on the same scene with different devices such as smartphones, tablets, and laptops.
- Client and server-side tools for connecting and synchronizing users.
Whitepaper
Find out how Zea and architectural metal & glass company Zahner used real-time collaboration to improve surveying workflows on large construction projects in our whitepaper “Real-time Calibration of Complex Structures.”
Virtual Reality
Zea leverages WebXR so that anyone can experience virtual reality from the browser.
- Interact with your projects collaboratively in VR from anywhere in the world.
- See your models from a bird’s-eye view or zoom in and inspect fine details.
- Use natural controls and gestures for a more immersive experience.
- Draw directly on your models or create geometry.
- Use almost any headset, including augmented reality-enabled headsets.
Cloud Infrastructure
Zea can also work with you to help set up a full cloud infrastructure coupled with the Zea Engine. Our Zea Drive is compatible with platforms such as Google Cloud or AWS.
- Cloud storage platform.
- Project history for simultaneous users.
- Identity and access management (ZIAM).
- Cloud compute.
FAQ
Developers can use any web app frameworks they chose to build user interfaces, including React, Vue, or Angular. We tend to use some of the newer frameworks like Stencil and Svelte, or no framework at all and just Vanilla HTML and JS. The source code is available for all of our samples to see how they were built.
For UI, we provide a web components library that makes building apps quick and easy. The UI library is built using Stencil, and is open source, so you can customize it to fit your needs. To see the live components library, please see our documentation here:
https://docs.zea.live/zea-engine/#/plugins-and-tools?id=zea-user-interfaces-library
Labels and annotations are rendered as 2d images on 3d billboards. 3d, in that they are positioned in the 3D scene. The images are generated using the browser DOM, so any data that is loadable into the DOM, text, images, custom fonts, etc.. can be used as the contents of a Billboard image. CSS styling can also be applied to the labels to make text bold, change its color etc…
For more information on setting up labels, please review the documentation and live samples found here: