Product Landing Page Puzzles

Hi everyone,

I would love some feedback on my product landing page. Thanks in advance!

https://codepen.io/crjett01/full/jOPxWwQ

-Casey

Hi Casey,

You passed all the tests, great job on that! However I am not to keen on the colors you are using. I suggest using a different color pallet. Also try to make the youtube video responsive so it can be properly viewed on mobile phones.

Max

@maximvs_557 Thank you for the feedback. I learned how to make the video responsive and appreciate you pointing that out. As for the colors, I may circle back to that later but for now I’d like to continue learning and moving forward.

Casey

You have to give the header a positive z-index otherwise the links won’t work when the page is scrolled so they are on top of the video. You also have to remove z-index: -1 from the video iframe otherwise it can’t be played.

I don’t think the colors are all that bad, I have seen worse. The page looks and works well enough, I like the hover effects on the product cards. Maybe spend a little more time giving it some polish and final touches.

Good work, keep it up!

@lasjorg I had given the iframe the negative z-index bc it was overlapping the header when I scrolled, but removing that and instead giving the header a positive z-index totally fixed that and allows it to play. Thanks for pointing that out and sharing how to fix it!

And thank you for the kind comments. I agree that the page could use polish and final touches like you mentioned, but I don’t know what is missing or what can be done. I’ve struggled with that on all of my projects actually.

The last 10% is always the hardest. Well that, and the blank page staring at you in the beginning.

I find the more real-world the project is, like using a real product, the easier it is to make good decisions about the design. It also helps to have some real text because words convey context and emotion that can be used to help guide the design.

I don’t really have any solid advice, maybe leave the project alone for a bit and come back to it with fresh eyes.

1 Like