Virtual Reality
With society becoming increasingly more dependent, expectant and attached to digital technology, the online world has the ability to lead a process of change but also spark negativity.
During my lifetime there have been huge developments in the way information is communicated. I believe the two-dimensional digital world we know has the potential to take on new forms that will communicate content better.
ROLE :
TIMELINE:
SKILLS NEEDED/USED:
IN COLLABORATION WITH:
Coding Developer and Designer of Virtual Environments
Dec 2020 – April 2021
HTML
Javascript Libraires
Node.js
Sound Layering
Solo Project
Project Overview
The project using Virtual Reality aimed to be the first step in exploring how 3-dimensional environments can hold information, imagery and content by using technology in new ways.
The end goal was to have a series of outcomes (made through code) that interact with the viewer in new ways and to communicate through our largest visual communicator, the internet.
Background Research
The developing concept of making the settings three-dimensional lead me to research and explore the different methods/mediums surrounding virtual reality.
I took inspiration from Olafur Elission Your Uncertain Archive, the environments made by developers on the platform Three.js and lessons gained from relatives who work in code.
Olafur Eliasson - Your Uncertain Archive
Three.js (VR coding platform)
Material Enquiry
In the contemporary era of digital technology, the ways in which we create have shifted into new mediums. This can be used as a new language of creativity that opens up new ways of working/making.
To create a virtual environment this project made use of JavaScript libraries (such as three.js and node.js), HTML, Sound Layering, Animation and image rendering platforms like Blender. The process of creating in alternative mediums opens up many new creative possibilities in this style of visual communication.
Foundational Code Still
First Layered Sound File (Stepping Squares)
Defining the Problems
The developing concept around making settings three-dimensional lead me to create six different setting overall (three of which contributed to final pieces).
The first three where more underdeveloped and less resolved, as I slowly understood how to create works though code. During this stage I was learning how to add multiple objects to setting, how to create movement and how to add HTML elements (e.g. buttons).
1
2
3
4
Virtual Immersive Environment 2 / 3
After gathering enough research data from users I began to see common themes, frustrations and areas of opportunity to develop the
environments design.
1). HTML button and Link through to external URL not coherent with environments design.
2). Internal editing tools feel 'jarring' to overall setting.
3). Moving Blender files sound not obvious enough to user.
4). 'Overcrowding' of internal setting.
Designing Solutions
Below shows the finished design style shown in each environment and highlights the key HTML elements that brought the layout together.
1). HTML 'Expand' button that makes screen enlarge to full screen size, creating a more immersive environment for the user to experience (inspired from user feedback).
2). HTML 'Sound' button, linking to layered sound file that depicts a variety of different individuals depicting what they are seeing on screen.
3). Overall environments now showcase a game-like setting where the viewer is immersed into. Aiming to ask questions around expectations of virtual settings and their potential.
1
3
2
Environment Still from 'Blue Towers'
Final UI
The final outcomes of the project consisted of three coded virtual environments. Each acts as a doorway into a virtual experience, aiming to start a conversation with the viewer around imagined, immersive and unordinary virtual experiences.
‘Virtually Immersed’ , Virtual Environment Still
‘Stepping Squares’ , Virtual Environment Still
‘Blue Towers’ , Virtual Environment Still
Three-dimensional Landing Page Showcasing the Final Series