DressOrc/Portfolio
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

removed some js, changed wording on some stuff

Browse source 
removed name stuff, api i was using wasnt accurate enough
rewrote project pages, changed profile image
This commit is contained in:
Nye Evans 2021-02-20 17:56:14 +00:00
parent 6dd4f7968e
commit 040a6b7b49
5 changed files with 34 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
index.html
View file

@ -7,15 +7,14 @@
<meta charset="UTF-8">
<script src = "pages\gallery.js" type = "module"></script>
<script src = "pages\siteTitle.js" type = "module"></script>
<title></title>
<title>Nye Evans Portfolio</title>
</header>
<body>
<div id = "introScreenSpace">
<h1>
<div id = "siteTitle"></div>
<div style = "font-size: 30%; padding-top: 10;">Portfolio</div>
<div id = "siteTitle">Nye Evans</div>
<div class = "subTitle">Portfolio</div>
</h1>
</div>
@ -26,7 +25,7 @@
</div>
<div style = "text-align: center;">
<img src = "" id = "profileImage" class = "profileImage orangeBorder">
<img src = "images/Profile2.png" id = "profileImage" class = "profileImage orangeBorder">
</div>
<div class = "textBox" style = "margin-bottom: 5vh;">
@ -36,7 +35,7 @@
</div>
<div class = "textBox" id = "galleryHeader">
check out my projects here:
check out my larger projects here:
<div style = "font-size: 60%;">click a project to find out more</div>
</div>

25
pages/gallery/aardvark-work/aardvark-work.html
View file

@ -4,23 +4,34 @@
</header>
<body>
<h1>
Tower defence game
AardvarkXR
</h1>
<div class = "textBox">
<h2>What it is</h2>
Aardvark is essentially a virtual reality browser that allows developers to create apps that overlay ontop of any program they wish. Apps (or "gadgets") are created through panels that run webcode. These panels can also hold and
interact with 3D models that Aardvark itself renders. This creates a sort of "mobile phone" like multi-tool that the user can access no matter what program or game they are using. <br><br>I was first introduced to Aardvark during its
initial release as its developers organised a hackathon with the aim to encourage the development of apps for it, which I attented. At the time of the hackathon I had little development experience within HTML or Javascript so was rather
out of my depth but as I have improved I have continued to revisit Aardvark.
Aardvark is a development framework, currently in alpha, designed to allow users to open small apps (known as gadgets) over the top of virtual reality programs or games. You could think of it as a mobile phone for use within
any vr software, its main focus is providing small utilities such as calculators or note taking apps. Developers can create apps for Aardvark using web code which it then renders over the users view, these renders can be 2D
or 3D which is a rather big positive as steamVR doesnt support 3D rendering on overlays so Aardvark has to do this itself. Due to all the code being webbased and run on servers, all gadgets are innately multi-user (with a small amount
of work from the developer) and when in social vr apps, people can open gadgets that will be seen by all other users within that program.
<br><br>
I was first introduced to Aardvark through a hackathon the developers ran on its inital release to the public in an attempt to gain developers to create basic apps for it, and since then I have periodically revisited it
when ideas for gadgets come to mind. When taking part in the first hackathon I had little to no experience with javascript or html, let alone typescript (the main language used for Aardvark development), so I was required
to teach myself over the course of the 3 days the hackathon ran for.
</div>
<div class = "videoContainer">
<iframe width="560" height="315" src="https://www.youtube.com/embed/aC5jJ5ntOFY" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<iframe width="560" height="315" src="https://www.youtube.com/embed/pux6RbySUMU" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div class = "textBox">
<h2>What I did</h2>
During the first hackathon I proposed and worked on an audio visualiser tool that would run in the background of the users environment as they worked, reacting to their desktop audio. I also designed and created 3D models for other
developers programs, such as icons for a playing card app; one of the first apps to be published on the platform.
developers programs, such as icons for a playing card app; one of the first apps to be published on the platform. My audio visualiser never got finished due to my lack of experience with typescript and Aardvarks inability to
request desktop audio access at the time. Around 4 months later I revisited Aardvark to create a photo viewing app which was originally a personal project but became a team effort with another member of the community who offered
to join development, the app allowed users to upload images which were stored using ipfs and had multi-user functionality allowing different people to show each other photos. The main idea of the program was to allow vr artists to
open reference images within their prospective drawing apps.
</div>
<div class = "videoContainer">
<iframe width="560" height="315" src="https://www.youtube.com/embed/E3gw_GXHH1s" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
<div id = "backButtonContainer">

6
pages/gallery/cat-tower-defence/cat-tower-defence.html
View file

@ -8,9 +8,9 @@
</h1>
<div class = "textBox">
<h2>What it is</h2>
A tower defence game, mostly created over the course of 1-2 months. Players can place cats to attack balls of wool rolling along a path. Cats can be upgraded with different upgrade paths and can be deleted to allow
for a partial refund. The tower system was designed to be easily expanded and altered along with a rudimentary map file system that allowed users to add maps of their own design. Although a functional prototype was
created, no artist was ever found to allow for a proper art pass or visual redesign so the project never left this first phase.
A tower defence game, mostly created over the course of 1-2 months to allow myself and a friend to gain a better understanding of python. Players can place cats to attack balls of wool rolling along a path. Cats can
be upgraded with different upgrade paths and can be deleted to allow for a partial refund. The tower system was designed to be easily expanded and altered along with a rudimentary map file system that allowed users to
add maps of their own design. Although a functional prototype was created, no artist was ever found to allow for a proper art pass or visual redesign so the project never left this first phase.
</div>
<div class = "videoContainer">
<iframe width="560" height="315" src="https://www.youtube.com/embed/YUKdlVf9n30" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

2
pages/gallery/epq-project/epq-project.html
View file

@ -14,7 +14,7 @@
The end result was a system that allowed the user to interact with a virtual environment with 6 degrees of freedom, they could pick up, move and throw objects with their fingers, hands and head being fully tracked to the
real world. Due to time restraints, the physics simulation was released separately and, although fully capable of location and force calculation, could not take rotation of objects into account. The project over all was
graded an <b>A*</b>
predicted an A* but when marked was 2 marks off, resulting in an A.
</div>
<div class = "videoContainer">
<iframe width="560" height="315" src="https://www.youtube.com/embed/pSlHM0kMijA" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

8
pages/mainpage.css
View file

@ -38,13 +38,19 @@ h1{
margin-top: 10vh;
margin-bottom: 70vh;
margin-left: 2vw;
margin-right: 70vw;
margin-right: 60vw;
height: 20vh;
text-align: left;
}
.subTitle{
font-size: 30%;
padding-top: 10;
padding-left: 5;
}
.orangeBorder{
border: 2px solid #ffd256;
border-radius: 5px;