This project was to create a code version and no code version of two different websites, we were given the content and then we had to design and build everything around it, so I started on Figma.

Here are my two Figma versions, the photos I sourced from the plugin Unsplash, after I read the text I picked the images that correlated well with them, and any colours I used in my websites were based on those images. The Street of Crocodiles, I used Days One font for header 1, Lora font for header 2, and Hind Madurai font for the main text. I got this font combination by using Fontjoy to explore the options. Women In Design I also used Fontjoy again for the design, Trirong font for header 1, Arsenal font for header 2, and Catamaran font for the main text. The Women in Design, I wanted to do something interesting and not just have everything straight down the middle, so I made everything off-centered to create negative space.

Week 11 - No code tools

I then made no code versions on Framer, for each website. Here are the links to my websites and to the week that we started using Framer. Week 12 - Critique Here is the link to the versions I completed for the Critique where I had some issues that I resolved, and the final version you can see below. and the links to the working websites that are responsive.

https://serious-apps-438419.framer.app/

My Framer Site (numerical-prism-481552.framer.app)

The HTML I preferred over Framer and I really enjoyed learning a new skill. Here is my link to my Github account where you can access all of my coding of the content and CSS.

https://github.com/E-FWarden/The-Street-of-Crocodiles.git

There were definitely moments when I struggled and that I needed help, luckily there were people I could ask or the Internet was very helpful too, an example of this was The Street of Crocodiles version I wanted the text to be beside an image which I was able to work out how to do with the help of the internet. I used ChatGPT as an assist when I didn’t understand why something wasn’t working, I found this helpful and a good way to use AI as it broke areas down for you. A time I used ChatGPT was when I didn’t understand how to launch my website, as seen below. The other main time I used It was to help make my website responsive as it gave me a base to work off, that I modified to suit my own websites.

Week 8 - HTML

Week 9 - HTML and CSS

Week 10 - HTML and CSS

Above is the links to my class work involving HTML and CSS.

Here are my links to the websites, I was able to get the Women in Design one responsive and to work correctly, unfortunately I was unable to get The Street of Crocodiles responsive working as I added text beside the image, so when the frame shrinks it doesn’t lay correctly. I’m disappointed that I was unable to get it working but I am very happy with my progress and all I created. I would go back another time to hopefully make it functional.

• Women in Design (e-fwarden.github.io)
• The Street of Crocodiles (e-fwarden.github.io)