MC's blog

Process Journal 3

Putting everything together now!

I'm a little bit in danger because I ended spending a lot of time compiling the drawings, renders, and text for each entry. I'm going to detail a few of the HTML coding things I tried to incorporate since then:

  1. Typewriter effect

I successfully managed to incorporate this effect using "getElementByID" for the header texts. However, I wanted to further this effect by combining it with .onScroll() to get all the subsection headers to type themselves out as the user scrolled down. Didn't work, but I think I'm close.

  1. Laurel advised me to use FancyApps to make a gallery with expandable images. It worked great, and I really liked the gallery view I got in the end.

  2. Embedded videos

I originally wanted to have the file directly linked to the page, but as I was using GitHub and my space was limited, I had to end up using youtube. Set the autoplay and mute.

I ended up spending a lot of time figuring out the spacing (just for desktop!) to make sure that the elements didn't swallow each other up. I did run out of time and there were a lot of improvements I wanted to have included. If I had more time (and perhaps more expertise), this is what I would have done:

  1. Make my website responsive to different device widths
  2. Created my own animated "glitch" effect backgrounds(rather than just white) that better incorporated the tumblr stickers, and perhaps even made a unique background for each page
  3. Have a disappearing scroll effect for the home page to further section the text so it doesn't get overwhelming