Web Project

I designed this simple website as a project for my Interaction Design class DMA217. This project involved getting the hang of basic coding languages such as HTML, CSS, and Javascript. We learned how to insert images and videos into our web pages, import fonts, and some other features. What I decided to do was make a simple landing page for reading, one of my favorite hobbies. This is inspired by a social media page I have with the same name that I use for posting book reviews and activities. I took ideas for that project and used things I learned in our class to put together the website seen here.

One of the interactions I really enjoyed adding to this site was the hover interaction over the navigation links. This makes using and visiting the site much more interesting. The links will change color when being hovered over, making them more dynamic and fun. I would love to continue incorporating this detail in other web projects that I do and see what other hover effects are possible.

The hardest part about this project was the image layout. This was my first time learning the basics of grid and flexbox in CSS. While my image display is not very exciting, it took me awhile to just figure out how to lay them across in that way. What I would like to do is eventually learn how to create an image carousel or find other ways to make the images more interactive. This will require some more practice in JavaScript and how I can use it to manipulate my HTML and CSS elements.

For future projects, I would like to go in with a solid plan and prototype designed on Figma for my website. That way I can know exactly what I need to create before spending so much time creating a design that I’m not entirely sure on. If I do this I can approach the website building process with clearer problem solving since I’ll know specifically what problem I need to solve.