I’ve updated the code to have some “pizzazz” as requested with some animations. Hover over the bio, my picture, or the portfolio pictures to see them in action.
- Text meant to only appear after a keyPressed selection is all appearing at the jump
- Would like to be able to expand or contract canvas size based on keyPressed selection as well
Hey here is my homework for day three.
I cleaned up the code and used clearer class and div names for positioning:
I drafted up a wireframe in my notebook and then went on to mock it up in Sketch.
Nav Menu in upper right is single block with words appearing beneath on mouse over: About, Projects, and Contact
Title adds a bounding box with mouse over
Social icon (linked in only) doesn’t move
Main project blocks descend one appearing from underneath another as the page loads
The small of the two sub divs will have a second one hidden. It slides out from under the IMG to cover the Project title. It could be a second image or a description.
Content blocks on product and about pages move same as above on open
Two blocks spread out and make room for a third in the center when mouse over one of them – a detail image or description related to the corresponding content block. Single image will be format for all in most cases.
Related projects get a slightly transparent overlay with another image or title or both when moused over. As is they show a single image with now title.
I like these sites because they are interactive/responsive but they are not excessive about it. They display skills and their design aesthetic without distracting from the content.
Exploring the domain of cognition, I created a memory game based on my own recollections of each city.