Html website with icons - FileZilla and Visual Studio Code

Updated: Jun 2, 2022

This is the final version of the graphic icons for the html website.

I chose to create 9 icons representing 9 magical creatures, 5 evil characters and 4 good ones.

Evil creatures:

- a vampire

- a griffin

- a cyclope

- a unicorn

- a warewolf

- an elf

- an orc

- a centaur

- a faun

All icons are made using the same colour palette, with different values of blue, grey, green, white and a bit of red for the evil creatures (to represent stains of blood or wounds). I draw all the characters on Adobe Illustrator using the same lines, shapes and background, to give the idea that they are all in the same environment (a dark, gloomy landscape at night).

After completing the icons, I uploaded the images in Visual Studio Code, made them all of the same size (300x300) and also changed the colour of the background for the website from white to a vibrant, bright blue that makes a nice contrast with the colours of the icons.

I also changed the order of the icons, placing them in rows of 3 and having 2 evil characters and a good character in the middle of the first two lines, while in the last line we have 2 good characters on the sides plus an evil creature placed in the middle.

FILEZILLA

After completing the coding for my website, I uploaded the images and sounds folder to FileZilla, using the university's digital media domain as a host for the website to publish it online.

Here's the link to the website sftp://s3955980@digitalmedia.rmit.edu.au/home/sh0/S3955980/public_html/portfolio/index.html

The images below show the open project in FileZilla and also the final result of the webpage!