Titulo Estágio
Live preview and coding assistance tool for Virtual Reality programming with A-Frame
Local do Estágio
DEI
Enquadramento
(For images, open the doc version of this proposal: https://bit.ly/3aeWpcr )
Teaching and learning how to program Virtual Reality (VR) environments is not easy. Creating a VR environment involves thinking in 3 dimensions and programming interactions that happen in a 3D space. In most development environments/frameworks, coding and visualizing the results happen at different times and in different spaces: the programmer first writes in a code editor window, and then executes and previews the result of that code on a different window. The disconnect in timing makes it more difficult to understand how values in the code affect the visual result, which is particularly troublesome for beginners.
This work is focused on a particular type of VR development environment: web-based, where both the coding and the VR environment are viewed through a web-browser.
Some tools already provide “live preview” functionality where, for example, programmers’ changes to the HTML code in one window causes a refresh in the browser so that the result can be seen almost immediately. However, in VR, refreshing a webpage means reloading the 3D environment, i.e., resulting in a reset in the viewing perspective of the user. If the change in the code caused something to change in a location of the VR environment which is not directly visible from the starting position, this will force the programmer to navigate again to that position in the VR environment to check if the change in the code produced the desired result.
The aim with this project is to allow programmers to immediately see the changes without completely reloading the VR environment. In addition, it is particularly helpful for beginners to have coding assistance tools where, for example, the possible values for a given parameter are displayed allowing the programmer to choose the desired one. Also, for some value types, having appropriate selectors that can be used through direct manipulation would be helpful (e.g., color selectors, value ranges).
Objetivo
The objective of this work is to develop a coding assistance with live preview tool that keeps programmers focused on the source code but at the same time allows them to immediately see the visual effects of changes in the code.
The tool should work with the most common development environment for A-Frame: the Glitch platform. The tool should be implemented as either a UserScript (i.e. for the Tampermonkey browser extension), or a browser extension.
The tool should help programmers immediately see the visual effect of changing attribute values in an A-Frame scene, display appropriate value selectors for direct manipulation, or lists of possible values.
Plano de Trabalhos - Semestre 1
1. Study the A-Frame VR framework
2. Study coding assistance tools
3. Study the Glitch editor
4. Develop an initial prototype that technically demonstrates the feasibility of the solution
Plano de Trabalhos - Semestre 2
1. Design and implement the tool
2. Evaluate the usability of the tool
3. Evaluate the learning impact of the tool
4. Write a scientific paper and dissertation
Condições
Estágio co-orientado por
Jorge C. S. Cardoso e
António José Mendes
Observações
Since A-Frame is a web-based VR framework, developing this project requires knowledge of JavaScript and HTML.
Orientador
Jorge Carlos dos Santos Cardoso
jorgecardoso@dei.uc.pt 📩