Panel One Reflection

An image of the homepage of Panel 1

New Skills Acquired

I learned a lot in our short time with Bootstrap! I learned how to use columns and rows within a webpage to align objects to be exactly where I want them to (this was something I really struggled with in Project One, so it's really nice to know it's such an easy fix). I learned how to make a way nicer NavBar than my previous one (again, this was something I found really difficult previously). I played around a lot with dropdown menus and resizing images so they're compatible with mobile layouts. I also learned all about the Bootstrap docs where I can find most of the info I need for pretty much anything I want to do.

Struggles Faced

I'm having a tricky time with columns and rows, so I think I just need a bit more time with them to really figure them out. I feel the same way about breakpoints, I would like some more experience with them so I can feel really confident about them.

Things I'm Proud Of

I'm really proud of this website page as a whole. I loved the idea of slightly recreating an existing company's webpage, so I chose VEJA because they have a relatively simple layout and I think it worked well with what I wanted to learn (formatting photos in rows and columns). I'm really proud of the NavBar and I'm excited about how quick I'm getting with Google Fonts.

What I Would Like to Learn

I really want to figure out how to layer buttons and photos, similar to the original VEJAS website. I wasn't able to figure that out this time, so I think that would be something cool to learn. I would also like to learn how to make a photo interactive, (like it changes as you scroll down). That was something I spent a lot of time looking into, but couldn't really figure out.

Panel Two Reflection

An image of the homepage of Panel 2

New Skills Acquired

During this panel, I learned all about selecting and modifying pre-existing templates made specifically for bootstrap. I found that it made bulding a website so much easier, especially because I already had most of the content created, such as the images.

Struggles Faced

It was a little annoying not being able to change any of the CSS, because there's some aspects that I really want to change (like that terrible orange color). I also want to change some of the smaller icons and there are some sections that I think are redundant and some that I would like to emphasize more, but I left most in because I want to see how much I can change it in Panel 3.

Things I'm Proud Of

I'm really proud of how this panel looks overall, even though it comes from a pre-existing template. I feel like a lot of the templates from the website were geared more towards a resume/professional website, so I'm really proud of the fact that I was able to find one I felt comfortable changing into a retail website. I also am proud of how I was able to create text and content for a page that wasn't previously there without taking away from the materials I already had.

What I Would Like to Learn

I'm really excited to learn more about changing these templates and making them way more custom. Ever since learning about these templates, I feel like now I'm able to recognize they whenever they're used (I looked at the website of where my dad works and I'm about 90% confident I can tell exactly which layout they're using lol).

Panel Three Reflection

An image of the homepage of Panel 3

New Skills Acquired

I learned very quickly how important the !imporant attribute is. There were so many moments where I thought I was doing a code entirely wrong or referencing the wrong thing before I realized "oh... I just need to label it as important". I also learned how important the inspect element is when adjusting already existing code, which will be super helpful for projects going forward with pre-existing templates. I learned how to adjust a gradient in the background of my masthead image, which is something I hadn't even considered. I also feel like I've learned much more about buttons in this panel, because learning the tiny differences between buttons can make a huge difference when customizing them.

Struggles Faced

I wasn't able to fully figure out how to change the color for a button or link that is active/being hovered over, so unfortunately, the orange color that I'm not a fan of will continue to live on this page after scrolling for a bit. Also, like I previously mentioned, before I remembered the !important attribute, it was very tough to figure out what was going wrong. I also tried to replace the VEJA title in the header with a logo, but I couldn't figure out how to insert it in without it looking bad, so that's something I'm going to have to mess around with a bit more in the future.

Things I'm Proud Of

I love how this template looks. I didn't move around too much layout-wise, but I still removed some sections and switched a couple of things around. I'm very proud of the fact that I figured out how to change the color of the little icons in the Materials section, and I love the color palette and font palette I switched the website over to. I'm also really proud of, what I mentioned before, changing the color of the mast head and still keeping it transparent. When I first changed it, it was completely opaque, but then I figured it out!

What I Would Like to Learn

After learning about WordPress in class, I'm really excited to learn more about it! I used WordPress in work without really knowing what it was, so I'm excited to get a better grasp on it and I think I'm going to prefer the layout of WordPress a lot! I'm also excited to make my pages more interactive. I was talking to my friend Saumya, who took this class last semester, and she showed me her website and it made me really excited to learn more about interactivity with scrolling.