diff --git a/README.md b/README.md index 737e88d..69fe70f 100644 --- a/README.md +++ b/README.md @@ -2,4 +2,6 @@ A summary of all my work, also my first proper web-design project. -Check out the page for more info on me and my work/for my contact details. Its hosted at https://Wil-Ro.github.io/Portfolio +Check out the page for more info on me and my work/for my contact details. Its hosted at https://wil-ro.github.io/Portfolio/ + +..hopefully diff --git a/files/CV.pdf b/files/CV.pdf deleted file mode 100644 index 3c652c8..0000000 Binary files a/files/CV.pdf and /dev/null differ diff --git a/files/RosiaEvansCV.pdf b/files/RosiaEvansCV.pdf new file mode 100644 index 0000000..340bf20 Binary files /dev/null and b/files/RosiaEvansCV.pdf differ diff --git a/images/Profile.jpg b/images/Profile.jpg deleted file mode 100644 index 40c723f..0000000 Binary files a/images/Profile.jpg and /dev/null differ diff --git a/images/Profile3.webp b/images/Profile3.webp new file mode 100644 index 0000000..1b601ab Binary files /dev/null and b/images/Profile3.webp differ diff --git a/images/Profile4.webp b/images/Profile4.webp new file mode 100644 index 0000000..17cf278 Binary files /dev/null and b/images/Profile4.webp differ diff --git a/images/popup-tongue.png b/images/popup-tongue.png new file mode 100644 index 0000000..a502049 Binary files /dev/null and b/images/popup-tongue.png differ diff --git a/images/popup-tongue.webp b/images/popup-tongue.webp new file mode 100644 index 0000000..18ad553 Binary files /dev/null and b/images/popup-tongue.webp differ diff --git a/images/wallpaper.png b/images/wallpaper.png deleted file mode 100644 index 39ff26c..0000000 Binary files a/images/wallpaper.png and /dev/null differ diff --git a/images/wallpaperPaper.png b/images/wallpaperPaper.png deleted file mode 100644 index 8c1b43f..0000000 Binary files a/images/wallpaperPaper.png and /dev/null differ diff --git a/images/wallpaperPaper1.png b/images/wallpaperPaper1.png deleted file mode 100644 index 18a4d8d..0000000 Binary files a/images/wallpaperPaper1.png and /dev/null differ diff --git a/index.html b/index.html index 646d591..bb5d955 100644 --- a/index.html +++ b/index.html @@ -1,121 +1,154 @@ - + +
+ + + - + Rosia Evans Portfolio
-

+

Rosia Evans
Portfolio

- An aspiring software developer who specialises in C++, C# and Python, with an intrest in lower level langauges like Assembly; - Most of my work is software based, with Python and C++ along with some web-development experience in HTML, CSS, JavaScript and TypeScript. + An aspiring developer who specialises in C++, C# and Typescript with an interest in lower level hardware and XR; + Most of my work is software based, making tools and messing around with VR software.
-
- me +
+ An image of Rosia Evans, Me +
- Most of my experience relates to personal projects, however I have previously done work experience at JBA Consulting writing a - program to convert their SQL databases to Excel spreadsheets and am currently working as an intern in software development in test. I also often teach Python and HTML, having taught many students at my school's coding club for over 6 years and having tutored - GCSE students briefly. You can see my full CV here. + Most of my experience relates to personal projects, however I have previously worked at Skipton Building Society, working in a small team + to experiment with automating their testing. I also often teach Python and HTML, having taught many students at my school's coding club for + over 6 years and having tutored GCSE students. You can see my full CV here.
Check out my larger projects here: -
click a project to find out more
+
hover over or click a project to find out more
+
+ - -
-

Tower defence game

- - - -

One of my first projects, this was created with a friend to help us gain a better understanding of python.

This was a basic tower defence game but featured a fully scalable - level design system. -

- - + -
-

Work on Aardvark XR

- - - -

Aardvark is a web-based virtual reality system which allows users to create and share web apps which are overlayed on top of the users VR experience.

- Over the course of its release I have attended its first hackathon and continued to support it long afterwards, having worked both on my own and with other developers to create apps - for the system to help it gain traction. -

- - -
- -
-

Unity based Mind Map software

- - - -

A project done as my final piece for my A-level computer science course.

This was a program designed to create mind maps, it could have nodes made, and linked, have images added and - included a pen tool to allow the user to draw notes on top of the mind maps. It also had a fully functional undo and redo system and the ability to save and load files. -

- - -
- - - - - -
I hope you like my work! If you ever want to contact me, my Email, Github and Social Medias can be found below.
+ Mastodon +   Twitter   Email   Github   - Dev.to - -   - CV + CV
diff --git a/pages/AllProjects.css b/pages/AllProjects.css new file mode 100644 index 0000000..78a5c07 --- /dev/null +++ b/pages/AllProjects.css @@ -0,0 +1,24 @@ +.projectThumbnail{ + width: 16vh; +} + +h2{ + text-align: center; + margin-bottom: 10vh; +} + +.item{ + display: flex; + margin-top: 4vh; +} + +.itemText{ + display: flex; + flex-direction: column; + padding: 10px; + color: #ffd256; +} + +body{ + margin: 20vw; +} \ No newline at end of file diff --git a/pages/AllProjects.html b/pages/AllProjects.html new file mode 100644 index 0000000..264fc27 --- /dev/null +++ b/pages/AllProjects.html @@ -0,0 +1,103 @@ + + + +
+ + + + + + + Nye Evans Portfolio +
+ + +

All Projects

+

click to find out more

+ + +
+ A virtual hand playing +
+

Aardvark XR

+
+ An open source project, this was a platform that would run small web-based apps over the top of other virtual reality programs, like a form of augmented reality within vr. + I helped produce apps, known as "gadgets" for the platform and created small additions to the main functionality of the program, adding a gesture system to allow the menu to be opened through hand gestures. +
+
+ +
+
+ +
+ A virtual hand grabbing a cube +
+

Vr interaction system

+
+ Done as a final project for my Extended Project Qualification (EPQ) and my first VR project, this was a basic program made in Unreal Engine that allowed users to grab and interact with physics based objects + in a small VR garden. +
+
+ +
+
+ +
+ A mind-map being build in a program +
+

Mind map tool

+
+ The final project for my A-levels, this was a Unity based tool that allowed the user to create mindmaps using a varied set of tools and a fully functional undo/redo system. +
+
+ +
+
+ + +
+ A game which displays a road with cats attacking wool along it +
+

Cat Tower Defence

+
+ Cat Tower Defence was a game made with a small group of friends in order to teach ourselves pythons "pygame" library, this was done over the course of a month or so and included some extra + modding space, allowing users to make their own levels. This was one of my first projects with a GUI. +
+
+ +
+
+ + +
+ the logo of Skipton Building Society, a blue castle +
+

Work for Skipton Building Society

+
+ Work done during an internship as a software tester/software developer in test at Skipton Building Society where I worked with a small team of 2-3 collegues + to push for, implement and later educate other testers on the society's automated UI testing. +
+
+ +
+
+ + + +
+ Twitter +   + Email +   + Github +   + Dev.to + +   + CV +
+ + + \ No newline at end of file diff --git a/pages/CVPage.css b/pages/CVPage.css index 167dcc2..f6e8040 100644 --- a/pages/CVPage.css +++ b/pages/CVPage.css @@ -12,14 +12,12 @@ body{ background-color: #181818; line-height: 1.3; + margin: 3vw; } h1{ font-size: clamp(20px, 4vw, 170px); text-align: left; - margin-top: 25vh; - margin-left: 10vh; - margin-bottom: 5vh; } @@ -39,9 +37,8 @@ ul{ } li{ - padding-top: 20px; + padding-top: 10px; font-size: 0.8vw; - padding-right: 50px; } a:link, a:visited{ @@ -50,148 +47,76 @@ a:link, a:visited{ .backButton{ text-align: center; - font-size: clamp(20px, 2vw, 170px); + font-size: clamp(20px, 1vw, 170px); margin-top: 10vh; } -.backButton{ - font-size: clamp(20px, 2vw, 170px); - - margin-top: 10vh; - margin-bottom: 5vh; - - text-decoration: none; -} - #backButtonContainer{ text-align: center; margin-bottom: 7vh; margin-top: 7vh; } -#cvBody{ - display: grid; - margin-left: 5vw; - margin-right: 5vw; - grid-template-columns: auto auto; - grid-template-rows: auto auto; - - min-height: 200px; - min-width: 90vw; - - border: solid 2px #ffd256; - border-radius: 5px; +#cv{ + display: flex; + flex-direction: column; padding: 10px; padding-bottom: 7vh; +} - font-size: 1vw; +#cvBody{ + display: flex; + flex-direction: row; + justify-content: flex-start; } #introText{ - grid-column: 1/3; - grid-row: 1; border-bottom: solid 2px #ffd256; - + font-size: 1.2rem; text-align: left; padding-bottom: 20px; } #workExperienceText{ - grid-column: 1; - grid-row: 2; - - margin-top: 10px; + width: 50%; } #extraNotesText{ - grid-column: 2; - grid-row: 2; - - margin-top: 10px; + width: 50%; } #cvDownload{ - margin-top: 10px; - margin-left: 5vw;; + text-align: center; } + @media (orientation:portrait){ - body{ - touch-action: manipulation; /*stops double tap zoom*/ - -webkit-text-size-adjust: none; /*stops browsers messing with text size*/ - -moz-text-size-adjust: none; - -ms-text-size-adjust: none; - text-size-adjust: none; - - line-height: 1.5em; + #cv{ + font-size: 1.8rem; } - h1{ - margin-left: 0; - margin-top: 5vh; - text-align: center; - font-size: clamp(20px, 10vw, 170px); - } - - h2{ - padding-top: 10px; - padding-bottom: 10px; - font-size: 3vw; - } - - h3{ - font-size: 2.4vw; - padding-bottom: 4px; - } - - ul{ - list-style-type: circle; - padding-bottom: 5px; - padding-left: 20px; - } - li{ - padding-top: 20px; - font-size: 2vw; - padding-right: 50px; + font-size: 1.3rem; } - .backButton{ - font-size: clamp(20px, 4vw, 170px); - - margin-top: 10vh; - margin-bottom: 5vh; - - text-decoration: none; + h3{ + font-size: 1.7rem; } + #workExperienceText{ + width: 100%; + } + + #extraNotesText{ + width: 100%; + } + #introText{ - grid-column: 1/3; - grid-row: 1; - border-bottom: solid 2px #ffd256; - - padding-bottom: 20px; - - font-size: 2vw; + font-size: 1.28rem; } - - #cvDownload{ - margin-top: 10px; - margin-left: 5vw;; - font-size: 3vw; - } - - #cvBody{ - margin-left: 3vw; - margin-right: 3vw - } - - } - - diff --git a/pages/CVPage.html b/pages/CVPage.html index 8bea8f2..3ef5af3 100644 --- a/pages/CVPage.html +++ b/pages/CVPage.html @@ -1,4 +1,5 @@ - + +
@@ -11,78 +12,85 @@

- CV + Curriculum Vitae

-
+

Rosia Evans

- I’m currently studying Computer Science, Psychology and Philosophy at A-level, as well as completing an Extended Project Qualification (EPQ) in Virtual Reality interaction design - and physics simulation (self-taught). I have a passion for creating new and unique user experiences as well as a strong desire to learn and gain new experience within the software - engineering industry. + Currently running a gap year working as a waiter, creating personal projects and teaching myself vector maths and C++ before moving to aberystwyth university in 2022.
+
+
+

Work Experience:

+
    +
  • +

    2018

    + A week's work experience at jba consulting writing a + program that converts SQL databases to excel spreadsheets. -
    -

    Work Experience:

    -
      -
    • -

      2018 – 2020

      - Kitchen Assistant at The Fleece Inn, Addingham
      Temporarily left for 6 months to focus on GCSEs, during which I was given a reference by the head chef as one of the most hard-working employees they had. -
    • -
    • -

      2018

      - A week's work experience at jba consulting writing a - program that converts SQL databases to excel spreadsheets. +
    • +
    +

    Extra Curricular:

    +
      +
    • +

      2012

      + Started programming learning Python and Scratch; moved onto HTML in 2015 and C#/C++ in early 2019. +
    • +
    • +

      2018 – 2021

      + Run school’s Coding Club, teaching younger children to program and running competitions and projects. First joined in 2014 as a first year. +
    • +
    • +

      2016

      + Creating mods and maps for video games; programming side projects. +
    • +
    • +

      2018 – Present

      + Creating video games and other programs or experiences for virtual reality and flat-screen platforms +
    • - -
    -

    Extra Curricular:

    -
      -
    • -

      2012 – Present

      - Started programming learning Python and Scratch; moved onto HTML in 2015 and C++ in early 2019. -
    • -
    • -

      2018 – Present

      - Run school’s Coding Club, teaching younger children to program and running competitions and projects. First joined in 2014 as a first year. -
    • -
    • -

      2016 – Present

      - Creating mods and maps for video games; programming side projects. -
    • -
    • -

      2018 – Present

      - Creating video games and other programs or experiences for virtual reality and flat-screen platforms; currently working on a tower defence game in Python; developing a new - programming language based in C++; and a virtual reality revision tool running in Unreal Engine 4 but soon to move to Unity. -
    • -
    -
    +
  • +

    2021 – Present

    + Tutoring GCSE students in python +
  • +
+
-
-

Education:

-
    -
  • -

    2014 – Present

    - Student at Ilkley Grammar School

    8 GCSEs grades 7-5
    Notable Grade 7s in Computer Science, Electronics, and Chemistry

    Current A-levels Computer Science, - Psychology, and Philosophy
    EPQ in Computer Science with a predicted grade: A-A* -
  • -
-

Skills:

-
    -
  • Python
  • -
  • C++
  • -
  • C#
  • -
  • HTML and CSS
  • -
  • JavaScript and TypeScript
  • - -
  • Blender's full 3D toolset
  • -
  • Unity's basic toolset
  • -
  • Unreal Engine's basic toolset
  • -
+
+

Education:

+
    +
  • +

    2014 – 2021

    + Student at Ilkley Grammar School

    + + 8 GCSEs grades 7-5
    + Notable Grade 7s in Computer Science, Electronics, and Chemistry

    + + 3 A-levels
    + Computer Science (A),
    + Psychology (A)
    + Philosophy (B)
    + with an EPQ in virtual reality design (A) +
  • +
+

Skills:

+
    +
  • Python
  • +
  • C#
  • +
  • HTML and CSS
  • +
  • JavaScript and TypeScript
  • +
  • C++
  • + +
  • Blender's full 3D toolset
  • +
  • Unity's basic toolset
  • +
  • Unreal Engine's basic toolset
  • +
+
diff --git a/pages/NoTwitter.html b/pages/NoTwitter.html index 9c44fc1..761561a 100644 --- a/pages/NoTwitter.html +++ b/pages/NoTwitter.html @@ -1,3 +1,4 @@ + no twitter here :)

I'll pop something here eventually, before i start using the site properly diff --git a/pages/basic.css b/pages/basic.css new file mode 100644 index 0000000..cc95ffc --- /dev/null +++ b/pages/basic.css @@ -0,0 +1,84 @@ +@import url("reset.css"); + +@font-face{ + font-family:"roboto"; + font-weight: 100; + src: url("../fonts/Roboto/RobotoMono-VariableFont_wght.ttf") +} +html{ + font: 100%; +} + +body{ + color: #ffd256; + background-color: #181818; + font-family: "roboto"; + line-height: 1.3; +} + +button{ + background-color: transparent; + border: none; + color: #ffd256; +} + + +button:focus { + border: none; + outline: none; +} + +a:not(.galleryLink), a:visited:not(.galleryLink){ + color: #ffd256; + border-radius: 2px; + transition: background-color 0.5s, color 0.5s; +} + +.galleryLink{ /*class to be given to any link that doesnt want fancy yellow backgrounds on hover*/ + text-decoration: none; +} + +h1{ + font-size: clamp(1.2rem, 4vw, 4rem); + + padding-left: 6; + + margin-top: 4vh; + + text-align: center; + +} + +.subTitle{ + font-size: 30%; + padding-top: 10; + padding-left: 5; +} + +#socialBar{ + display: flex; + margin-bottom: 5vh; + + justify-content: center; +} + +#backButtonContainer{ + text-align: center; + margin-bottom: 7vh; + margin-top: 7vh; +} + + +.orangeBorder{ + border: 2px solid transparent; + border-radius: 5px; + + padding: 5px; + + transition: border 0.5s; +} + +.orangeBorder:hover{ + border: 2px solid #ffd256; + padding: 5px; +} \ No newline at end of file diff --git a/pages/effects.css b/pages/effects.css index 8ec994d..5835951 100644 --- a/pages/effects.css +++ b/pages/effects.css @@ -1,3 +1,7 @@ +a:not(.galleryLink){ + transition: background-color 0.5s +} + a:hover:not(.galleryLink){ background-color: #ffd256; color: #181818; @@ -41,4 +45,4 @@ span:hover{ ::-webkit-selection { background-color: #ffd256; color: #181818; -} \ No newline at end of file +} diff --git a/pages/gallery/aardvark-work/aardvark-work.html b/pages/gallery/aardvark-work/aardvark-work.html index 29cb91e..f83b070 100644 --- a/pages/gallery/aardvark-work/aardvark-work.html +++ b/pages/gallery/aardvark-work/aardvark-work.html @@ -1,7 +1,11 @@ - + +
+ + + Rosia Evans Portfolio

@@ -25,8 +29,7 @@

What I did

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. 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. + developers programs, such as icons for a playing card app; one of the first apps to be published on the platform.
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 (a decentralized storage system) 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 @@ -38,14 +41,20 @@
- As well as this I have also worked on the base code of the project itself. Originally Aardvark had the user open its Ui through a button on their hand which took up valuable space used by alot of other programs, + As well as this I have also worked on the base code of the project itself. Originally Aardvark had the user open its Ui through a button on their hand which took up valuable visual space used by alot of other programs. I was tasked with creating a more intuitive solution which ended up being a gesture based system. With little to no guidance I had to read and gain a full understanding of the projects mid-level inner workings and - rewrite large sections of it. This resulted in a system where the user would bump the ends of their controllers together to open and close the menu, this addition to the program also utilised hysterisis to ensure the - user had a smooth experience with the project. + rewrite large sections of it. After a week or so I produced a gesture system that allowed the user to bump the ends of their controllers together to open and close the menu. I also created a developer tool to allow + developers to tweak the gesture to ensure it worked for their specific controllers. + +
+ +
+ +
- \ No newline at end of file + diff --git a/pages/gallery/aardvark-work/projectHeaderImage.webp b/pages/gallery/aardvark-work/projectHeaderImage.webp new file mode 100644 index 0000000..2605ab6 Binary files /dev/null and b/pages/gallery/aardvark-work/projectHeaderImage.webp differ diff --git a/pages/gallery/blog-post-default.css b/pages/gallery/blog-post-default.css index 2e3329c..65a8a7a 100644 --- a/pages/gallery/blog-post-default.css +++ b/pages/gallery/blog-post-default.css @@ -10,7 +10,8 @@ body{ color: #ffd256; font-family: "roboto"; background-color: #181818; - + margin-left: 10vw; + margin-right: 10vw; } h1{ @@ -32,6 +33,7 @@ a:link, a:visited{ font-size: 1vw; margin-top: 3vh; + padding: 2.5vh; } @@ -42,10 +44,15 @@ a:link, a:visited{ } iframe{ - border: 2px solid #ffd256; + border: 2px solid transparent; border-radius: 5px; padding: 5px; + transition: border 0.5s; +} + +iframe:hover{ + border: 2px solid #ffd256; } .backButton{ @@ -57,11 +64,6 @@ iframe{ text-decoration: none; } -#backButtonContainer{ - text-align: center; - margin-bottom: 7vh; - margin-top: 7vh; -} @media (orientation:portrait){ diff --git a/pages/gallery/cat-tower-defence/cat-tower-defence.html b/pages/gallery/cat-tower-defence/cat-tower-defence.html index c83cc54..8a56901 100644 --- a/pages/gallery/cat-tower-defence/cat-tower-defence.html +++ b/pages/gallery/cat-tower-defence/cat-tower-defence.html @@ -1,7 +1,11 @@ - + +
+ + + Rosia Evans Portfolio

@@ -25,7 +29,7 @@

- \ No newline at end of file + diff --git a/pages/gallery/cat-tower-defence/projectHeaderImage.webp b/pages/gallery/cat-tower-defence/projectHeaderImage.webp new file mode 100644 index 0000000..c5b2f77 Binary files /dev/null and b/pages/gallery/cat-tower-defence/projectHeaderImage.webp differ diff --git a/pages/gallery/epq-project/epq-project.html b/pages/gallery/epq-project/epq-project.html index b3845f7..0491e6f 100644 --- a/pages/gallery/epq-project/epq-project.html +++ b/pages/gallery/epq-project/epq-project.html @@ -1,7 +1,11 @@ - + +
+ + + Rosia Evans Portfolio

@@ -9,12 +13,12 @@

What it is

- This project was completed for my Extended Project Equalification (also knows as EPQ). During the EPQ, a student will pick a subject of their choice, research it and then either write a paper or create a piece of media + This project was completed for my Extended Project Equalification (also known as EPQ). During the EPQ, a student will pick a subject of their choice, research it and then either write a paper or create a piece of media (an "artefact") based on what they have learnt. For my subject I originally chose physics simulation as at the time I lacked confidence in maths and wanted to force myself to relearn and become more comfortable with it. The idea of combining VR with this later came about in an attempt to make the project more modern so more primary research and testing could be done.

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 gains a high A grade. + 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 was given a high A grade.
@@ -22,14 +26,14 @@

What I did

- Over the course of 4-5 months I researched and taught myself a large amount of vector maths, C++, the design of basic physics engines, a large portion of Unreal Engines toolset, a large portion of blenders toolset, + Over the course of 4-5 months I researched and taught myself a large amount of vector maths, the basics of C++, the basics of physics engines, a large portion of Blender and Unreal Engines toolset, a small amount of 3D rendering theory and the basics of game design for virtual reality. Using this I created a fully functional VR interaction system with many custom made assets, materials and classes as well as a very basic physics engine built in C++.
- \ No newline at end of file + diff --git a/pages/gallery/epq-project/projectHeaderImage.webp b/pages/gallery/epq-project/projectHeaderImage.webp new file mode 100644 index 0000000..a830abc Binary files /dev/null and b/pages/gallery/epq-project/projectHeaderImage.webp differ diff --git a/pages/gallery/mind-map/mind-map.html b/pages/gallery/mind-map/mind-map.html index ffd4f99..bade77d 100644 --- a/pages/gallery/mind-map/mind-map.html +++ b/pages/gallery/mind-map/mind-map.html @@ -1,11 +1,14 @@ - +
+ + + Rosia Evans Portfolio

- EPQ Project + Mind Mapping Software

What it is

@@ -19,15 +22,15 @@

What I did

- Over the course of 24 hours spread over 2 months I planned, wrote pseudocode for and create the whole system. I chose to write the sofware in Unity as I wanted to learn a new engine and knew the unitys use of scenegraphs - would make the process of development alot faster as I wouldn't have to calculate scales and positions of mind map components as unity would do this all in the background, allowing me to focus on UI, tool, components and the - undo-redo system.

As one of the software requirements was to run on very low end computers I also had to ensure I was creating scripts that would run as efficiently as possible when compiled, this regularly meant having to + I independently created this program over the course of 24 hours spread over 2 months. I chose to write the sofware in Unity as I wanted to learn a new engine and knew that unitys use of scenegraphs + would make the process of development alot faster as I wouldn't have to calculate scales and positions of mind map components as unity would do this all in the background, allowing me to focus on the larger aspects of the project.

+ As one of the software requirements was to run on very low end computers I also had to ensure I was creating scripts that would run as efficiently as possible when compiled, this regularly meant having to weigh up the strengths and weaknesses of different libraries, often choosing ones with drawbacks in favour of their lower usage of memory.
- \ No newline at end of file + diff --git a/pages/gallery/mind-map/projectHeaderImage.webp b/pages/gallery/mind-map/projectHeaderImage.webp new file mode 100644 index 0000000..a652e31 Binary files /dev/null and b/pages/gallery/mind-map/projectHeaderImage.webp differ diff --git a/pages/gallery/room-builder/projectHeaderImage.webp b/pages/gallery/room-builder/projectHeaderImage.webp new file mode 100644 index 0000000..1fe906a Binary files /dev/null and b/pages/gallery/room-builder/projectHeaderImage.webp differ diff --git a/pages/gallery/room-builder/room-builder.html b/pages/gallery/room-builder/room-builder.html index 89c110a..77d10d6 100644 --- a/pages/gallery/room-builder/room-builder.html +++ b/pages/gallery/room-builder/room-builder.html @@ -1,7 +1,11 @@ - + +
+ + + Rosia Evans Portfolio

@@ -23,7 +27,7 @@

- \ No newline at end of file + diff --git a/pages/gallery/sbs-work/projectHeaderImage.png b/pages/gallery/sbs-work/projectHeaderImage.png new file mode 100644 index 0000000..47ed949 Binary files /dev/null and b/pages/gallery/sbs-work/projectHeaderImage.png differ diff --git a/pages/gallery/sbs-work/projectHeaderImage.webp b/pages/gallery/sbs-work/projectHeaderImage.webp new file mode 100644 index 0000000..3edc8d8 Binary files /dev/null and b/pages/gallery/sbs-work/projectHeaderImage.webp differ diff --git a/pages/gallery/sbs-work/sbs-work.html b/pages/gallery/sbs-work/sbs-work.html new file mode 100644 index 0000000..3ede456 --- /dev/null +++ b/pages/gallery/sbs-work/sbs-work.html @@ -0,0 +1,60 @@ + + +
+ + + + + Rosia Evans Portfolio +
+ +

+ Work for Skipton Building Society +

+
+

What it is

+ Inbetween my time at University and Post-16 I took a gap year where I interned at Skipton Building Society as a software tester. This was a paid 9 month internship where I waspushed for automated testing + with SmartBears TestComplete system and worked with their API team to ensure their software remained stable whilst they slowly worked through all their API's transitioning them from TIBCO to Azure. +

+ I was also asked to research Gherkin and Behaviour Driven Development to see if it would be worth transitioning to, helped to run a coding club to educate other members of the Society and later set-up + the Society's standards for all their future automated testing. +
+ +
+

What I did

+ I was initially hired to experiment with the idea of automating the Society's testing using SmartBear's TestComplete system. I taught myself a large portion of the tools over the course of a week + and then worked with one other collegue who came from a testing background to fully automate the UI testing of the Ds customer portal system. + From this we decided the tool may be worth using across the wider Society and worked with individual agile scrum teams to help them automate their testing. During this time I produced a presentation + on the inner workings of TestComplete and its benefits to the Society's senior developers convincing them of its worth. I also worked with my collegue to produce an educational talk, some tools and documentation + in order to educate other testers on the system and encourage widespread use. +

+ After 3 months of working on TestComplete I was assigned to an Agile Hub in order to help them with their testing on the side whilst still working on TestComplete. This team was built to slowly + transition all of the societies APIs from TIBCO to Azure and my job was to ensure any software interacting with the API currently being replaced would still work when the team had finished. This was + done through large amounts of manual regression tests and a few automated tests where their work overlapped with my other TestComplete work. This was somewhat challenging for me to begin with as I had + little understanding of alot of the software I was testing and I found myself somewhat anxious when communicating with the team, however I slowly improved at this over time and ended up working with relative + efficiency. I did this through pushing myself to ask people questions and eventually reorganising my time by meeting with all the teams developers at the very start of an API development cycle to have a full + conversation with all of them on what needed to be tested and how rather than individually asking developers and having to compile the individual comments of each developer. +

+ On the side of this I also ran a talk to teach testers the basics of javascript to increase the flexibility of their automated tests and later helped some lead developers to run a bi-weekly "Coding Club" to + educate testers on programming with C#. One of these lead developers also tasked me with researching into the testing language "Gherkin" and the concept of Behaviour Driven Development, I spent 2 months + experimenting with it on the side whilst doing my regular work and produced a presentation to them and a group of senior testers where I then facilitated more conversation on the viability of the system its + usefulness to the Society. I then organised regular meetings to continue the discussion. +
+ +
+

Skills Learnt

+ Throughout this internship I feel that my social skills developed greatly, I got alot better at giving critisism, being willing to ask questions and admit I didnt understand things and developed my self-confidence. + I also learnt a large amount about Microsoft's Azure Cloud Systems and manual and automated testing. I also gained real experience of an Agile working environment which I greatly enjoyed and I developed a much + stronger understanding of APIs and back-end programming which I had never previously looked into. +

+ Multiple times during my work there I was requested to stay as an apprentice rather than go to University, I did turn this offer down but I intend to work for them over summers and during my industry year at + University as I found it an incredibly friendly and safe feeling place with a really healthy culture. Their attitude towards change was very exciting to work in and multiple times I found I would make a mistake + and be worried my teams would be annoyed or upset only to find they wouldnt even consider it an issue and with zero negative responses they would just ask how they could help to fix it and help me plan a solution. +
+ +
+ <-Back +
+ + + diff --git a/pages/mainpage.css b/pages/mainpage.css index 98b8938..381a82f 100644 --- a/pages/mainpage.css +++ b/pages/mainpage.css @@ -1,38 +1,4 @@ -@import url("reset.css"); - -@font-face{ - font-family:"roboto"; - font-weight: 100; - src: url("../fonts/Roboto/RobotoMono-VariableFont_wght.ttf") -} -html{ - font: 100%; -} - -body{ - color: #ffd256; - background-color: #181818; - font-family: "roboto"; - line-height: 1.3; -} - -button{ - background-color: transparent; - border: none; - color: #ffd256; -} - - -button:focus { - border: none; - outline: none; -} - -a:link, a:visited{ - color: #ffd256; -} - -h1{ +#Title{ font-size: clamp(1.2rem, 4vw, 4rem); padding-left: 6; @@ -47,19 +13,6 @@ h1{ } -.subTitle{ - font-size: 30%; - padding-top: 10; - padding-left: 5; -} - -.orangeBorder{ - border: 2px solid #ffd256; - border-radius: 5px; - - padding: 5px; -} - .textBox{ text-align: center; font-size: clamp(1rem, 1.2vw, 3rem); @@ -70,9 +23,18 @@ h1{ margin-right: 10vw; } -.profileImage{ +.profileImageContainer{ width: 30vw; - height: auto; + height: 30vw; + text-align: center; + margin: 0 auto; +} + +.profileImage{ + border-radius: 2px; + object-fit: cover; + width: 100%; + height:100% } #galleryHeader{ @@ -84,259 +46,194 @@ h1{ font-size: clamp(1rem, 1.2vw, 3rem); } -.programGallery{ - display: grid; - grid-template-columns: repeat(12, 1fr); - grid-template-rows: repeat(10, 1fr); - - height: 70vh; - width: 70vw; - - min-width: 800px; - min-height: 500px; - - margin-left: auto; - margin-right: auto; - margin-top: 10vh; +.gallery{ + display: flex; + margin-left: 10vw; + margin-right: 10vw; + height: 19vh; + margin-bottom: 5vh; + transition: margin-bottom 2s 2s ease-in; + justify-content: space-evenly; } +.galleryContainer:hover .gallery{ + margin-bottom: 28vh; + transition: 0.5s; +} -.galleryImage{ /*all images should be 700x700*/ - grid-column: 2/8; - grid-row: 2/12; - - object-fit: cover; - - width: 100%; +.galleryItem{ height: 100%; - - border: 2px solid #ffd256; - border-bottom-left-radius: 5px; - box-sizing: border-box; - - padding: 5; } -.galleryLink{ - grid-column: 2/8; - grid-row: 2/12; - object-fit: cover; +.galleryItem:hover + .galleryPopup{ + visibility: visible; + opacity: 1; +} +.galleryItem:hover .popupTongue{ + visibility: visible; + opacity: 1; +} + +.galleryPopup:hover{ + visibility: visible; + opacity: 1; +} + +.galleryPopup:hover .popupTongue{ + visibility: visible; + opacity: 1; +} + +.galleryPopup{ + visibility: hidden; + opacity: 0; + + display: flex; + z-index: 5; + position: absolute; + background-color: #ffd256; + border-radius: 2px; + color: #181818; + width: 78.5vw; + height: 19vh; + transition: visibility 0.3s, opacity 0.5s; + margin-top: 20.85vh; +} + +.popupTongue{ + visibility: hidden; + opacity: 0; + transition: visibility 0.3s, opacity 0.5s; + + width: 1.85vh; + height: 1.85vh; + margin-left: 5vw; +} + +.popupImage{ + /*display: none;*/ + padding: 10px; +} + +.popupTextContainer{ + display: flex; + flex-direction: column; + padding: 6px; + color: #181818; +} + +.galleryImage{ width: 100%; height: 100%; } -.galleryTitle{ - grid-column: 2/12; - grid-row: 1; - - padding: 5px; - - font-size: clamp(1rem, 3vw, 3rem); - - border-radius: 0; - border-top-left-radius: 5px; - border-top-right-radius: 5px; - - border: 2px solid #ffd256; - border-bottom: none; +.galleryImageContainer{ + height: 100%; + width: 100%; + display: block; } -.galleryCaption{ - grid-column: 8/12; - grid-row: 2/12; - - border-radius: 0; - border-bottom-right-radius: 5px; - - border: 2px solid #ffd256; - border-left: none; - - padding: 5px; - - font-size: clamp(1rem, 1.2vw, 3rem) +.galleryTitle{ + font-weight: 700; } -.galleryLeftArrow{ - grid-column: 1; - grid-row: 5/6; - - font-size: 7vw; -} - -.galleryRightArrow{ - grid-column: 12; - grid-row: 5/6; - - font-size: 7vw; +#galleryOutroLink{ + text-align: center; + margin-top: 5vh; } #outroText{ - margin-top: 20vh; + margin-top: 12vh; margin-bottom: 20vh; margin-left: 27vw; margin-right: 27vw; } -#socialBar{ - display: flex; - margin-bottom: 5vh; - - justify-content: center; -} - - - - @media (orientation:portrait){ - - body{ - /* - touch-action: none; - touch-action: pan-y; - as well as disabling double tap, disables zoom which some people with bad eyes need, use something else - */ - touch-action: manipulation; /*stops double tap zoom*/ - - -webkit-text-size-adjust: none; /*stops browsers messing with text size*/ - -moz-text-size-adjust: none; - -ms-text-size-adjust: none; - text-size-adjust: none; - } - - h1{ + #Title{ font-size: 10vw; - - margin-left: 0vw; - margin-right: 0vw; - margin-top: 5vh; - margin-bottom: 85vh; - - padding-top: 0.5vh; - - border-radius: 0; - - height: 10vh; - + margin-right: 50vw; } - + .textBox{ - padding: 0; - margin-top: 3vh; - margin-bottom: 3vh; - margin-left: 15px; - margin-right: 15px; - - min-width: inherit; - max-width: inherit; - - border: 0; - - text-align: left; - font-size: clamp(25px, 3.6vw, 50px); + font-size: 0.7rem; + margin-left: 2vw; + margin-right: 2vw; } + .profileImageContainer{ + margin: 2vh; + width: auto; + height: auto; + } + .profileImage{ - width: 90%; - } - - .orangeBorder{ - border: 5px solid #ffd256; - border-radius: 10px; + border-radius: 1vw; } #galleryHeader{ - margin-left: 15px; - margin-right: 15px; - font-size: clamp(2rem, 4vw, 5rem); - } - - .programGallery{ - width: 92vw; - - margin-left: 4vw; - margin-right: 4vw; - - border: 5px solid #ffd256; - border-radius: 10px; - } - - .galleryImage{ /*all images should be 700x700*/ - grid-column: 1/13; - grid-row: 2/7; - - border-radius: 0; - border: 5px solid #ffd256; - border-left: 0; - border-right: 0; + margin-left: 2vw; + margin-right: 2vw; + font-size: 0.7rem; + } - object-fit: cover; - - width: 100%; - height: 100%; - - } - - .galleryLink{ - grid-column: 1/13; - grid-row: 2/7; - - object-fit: cover; - - width: 100%; - height: 100%; - } - - .galleryTitle{ - grid-column: 1/13; - grid-row: 1; - - padding: 5px; - - font-size: clamp(5px, 4vw, 50px); - - border: 0; - } - - .galleryCaption{ - grid-column: 1/13; - grid-row: 7/12; - - font-size: clamp(5px, 3vw, 50px); - - border: 0; + .gallery{ + margin-left: 2vw; + margin-right: 2vw; + justify-content: flex-start; + flex-wrap: wrap; + height: 100vw; } - .galleryLeftArrow{ - grid-column: 1; - grid-row: 12; - font-size: 7vw; + .galleryItem{ + width: 20vw; + height: 20vw; + margin-bottom: 3vw;; } - .galleryRightArrow{ - grid-column: 12; - grid-row: 12; - font-size: 7vw; + .galleryPopup{ + visibility: visible; + opacity: 1; + z-index: 0; + position: static; + background-color: transparent; + color: #ffd256; + width: 73.5vw; + height: 20vw; + margin-top: 0vh; } + .popupTongue{ + display: none; + } + + .popupImage{ + display: none; + } + + .galleryImage{ + border-radius: 2px; + } - + + #galleryOutroLink{ + font-size: 0.7rem; + } + #outroText{ - margin-top: 20vh; + margin-top: 12vh; margin-bottom: 20vh; - margin-left: 1vw; - margin-right: 1vw; + margin-left: 2vw; + margin-right: 2vw; } - #socialBar{ - justify-content: center; - font-size: 5vw; - margin-bottom: 0.8vh; + .galleryLink{ /*this is set in basics, but the gallery on mobile will want to be different*/ + text-decoration: none; + color:#ffd256; } } - - diff --git a/scripts/gallery.js b/scripts/gallery.js index 67846f2..6b7df0b 100644 --- a/scripts/gallery.js +++ b/scripts/gallery.js @@ -1,8 +1,8 @@ var currentSlide = 0; var allSlides = document.querySelectorAll(".programGallery"); - -window.nextSlide = function nextSlide(){ +// code for gallery to function during use +window.nextSlide = function nextSlide(){ currentSlide++; updateSlide(); } @@ -30,5 +30,8 @@ function hideAll(){ } } +// code to set up gallery when site is being loaded + + hideAll() -updateSlide(); \ No newline at end of file +updateSlide();