Utilize these helpful links to make a layout. Coding isn’t about memorizing but looking up resources and references to work on top of them..
Choose 2 pens from the flexible pens and combine functions to make a web poster.
You may pick a pen from the stubborn list and combine with a flexible pen to make a web poster.
Your web poster should carry out a simple message. What happens when you stretch/shrink/scroll your browser? How does your container carry your message? Is there a surprising element when you scroll or hover or in time?
Design – Code – Design – Code is an appropriate journey to this project. Let your initial design be influenced / dictated by your coding restrictions, findings and troubleshooting. Your initial design isn’t the fixed final destination. That’s prototyping.
Flexible Pens (easy):
Relative vs Fixed
Video Background (Vimeo Only)
Nav and Scrolling
Hover To Hide
Hover To Shake
Various Classes on Typography
Background Color Animation
Remember: Be Like Water !
Screen-based design and typography heavily relies on a (in)visible container. This container that carries your message should be flexible. So don’t approach this as if you are composing a printed poster and try to control all the elements on the poster. Your elements will move around, your paragraph texts lines will overflow as you shrink the browser width or view in different browsers (internet explore, Mozilla, Chrome). Approach this project as if your content is liquid and you are pouring your content into a container.