Link to project: https://jwli-void-portfolio.netlify.app/
How It's Made: Tech used: HTML, CSS, JavaScript, Flex Box and CSS Grid, Media queries
The complex structure of this deliverable presented unique challenges with implementation that in turn, presented opportunities for me to grow as a developer Having to essentially design 3 separate but interdependent versions of this site was especially interesting due to the several instances of asymmetrical content layout
Optimizations:
The key optimizations that needed to be made with this one were mostly related to the three media queries responsible for the sites dynamism. When a site has many asymmetrical aspects it can be challenging to make sure the site flows as one cohesive experience across all viewing devices. This is especially true for devices that give users access to more than one view mode (eg phone and tablets changing between vertical and horizontal viewing modes) The key factor to consider in these situations is making sure the location of content on the screen changes in ways that is both consistent across the site and intuitive for the user on their respective device.
All in all I was able to really extend my understanding of the power of using Flex box and Grid together!