14. Interface and Application Programming: Noah, Tyler¶
After doing our documenting, we realized that we really focused on visualizing data, but thats on of the biggest points in interfaces so its important that you learn about some of the higher level possible programs.
Three.js - Noah¶
Three.js is a very simple yet powerful tool. It is what allowed me to make my home page. It allows for an advanced 3d experience, some examples include this really cool page with a meaning I don’t even understand. For some great examples, look towards this website of examples. It’s also really strong in that it is Incredibly well documented on it’s page. This good documentation was also fed into every AI, as from my experience, even a beginner can generate incredibly cool things (like my landing page).
Webservers - Tyler¶
Web servers are a powerful tool for interfacing with microcontrollers, enabling creators to monitor and control devices remotely through a regular web browser you can find on your phone. They allow live visualization of sensor data, like temperature, motion, or light signals and you don’t need any specific software to read these values. Microcontrollers with network capabilities like the Seeed Studio ESP32 S-3 or Arduino uno can sponsor web servers that serve C++, Java, and HTML. These servers can also take in inputs from the user, such as buttons or sliders to send any commands for responses or outputs. Overall, web servers create a user-friendly, independent way to communicate with and control embedded projects.
Below is a picture of a webserver I used to controller a RC car I built
link to site
Unity - Noah¶
Unity might be a bit out there, but in the context of microcontrollers it is one of the strongest choices for making an app with them. A couple years ago, for a local escape room, I made a puzzle that used props in the environment to input into a airplane controller looking box, which had a giant screen. the giant screen was powered by a mini computer. This mini computer couldn’t be a Pi, as at the time it didn’t have enough performance to power the 4k monitor. with that mini computer, I wired it to an arduino and made some simple buttons to act as the input for the machine. Code wise, I used
System.IO.Ports
which featured really easy to use commands for reading from serial, almost word for word the same syntax as an microcontroller reading from serial.
Unfortunately, I lost all of the files for the project over time.
The Big Comparison¶
| Feature | Three.js with Microcontroller Data | Web Server Off a Microcontroller | Unity Interfaced with a Microcontroller |
|---|---|---|---|
| Description | Renders 3D visualizations in a web browser using Three.js, data provided by microcontroller (often via an intermediate server). | Microcontroller hosts a simple web server to display data directly in a browser. | A Unity application running on a computer communicates directly with the microcontroller for interactive 3D visualization. |
| Complexity | Moderate to High (Web development, Three.js, potential server setup) | Moderate (Microcontroller programming with network stack, basic web development) | Moderate to High (Unity development, C# scripting, communication protocols) |
| Performance | High (Rendering offloaded to client GPU) | Low to Moderate (Limited by microcontroller resources) | High (Leverages computer’s CPU and GPU) |
| Development Effort | Moderate to High (Front-end, back-end, microcontroller) | Moderate (Embedded web development, simple front-end) | Moderate to High (Unity environment, communication code on both ends) |
| Data Transfer | Microcontroller to server (HTTP, MQTT, etc.), server to browser (WebSockets, HTTP) | Direct from microcontroller to browser (HTTP) | Direct between microcontroller and computer (Serial, USB, etc.) |
| Required Hardware | Microcontroller with network, web server host (can be microcontroller or separate), client with browser. | Microcontroller with sufficient resources and network, client with browser. | Microcontroller with communication interface (e.g., USB), computer capable of running Unity, physical connection. |
| Capabilities | Highly flexible and interactive 3D web visualizations, accessible remotely. | Simple data display, basic charts/controls via browser, local access often. | Immersive and complex 3D environments, simulations, high fidelity graphics, dedicated application. |
| Use Cases | Interactive dashboards, complex data visualization on the web, remote monitoring with rich interfaces. | Simple sensor monitoring, basic control interfaces, low-cost data display. | Real-time interactive simulations, physical computing projects integrated with 3D environments, games driven by physical input. |
| Pros | Rich visualization possibilities, platform-independent client (browser), leverages client GPU. | Simple architecture for basic needs, direct access to device data, potentially lower hardware cost (no separate server if microcontroller is capable). | Powerful 3D rendering and interaction, strong for simulations and interactive installations, leverages computer’s processing power. |
| Cons | Requires web development expertise, can be complex to set up real-time data streaming, dependent on browser performance. | Limited visualization complexity, performance bottlenecks on microcontroller, requires basic web development knowledge. | Requires a dedicated application on a computer, not easily accessible remotely without additional streaming/networking setup, requires Unity expertise. |