Hover (or click) each box for description

Alysh Interiors site (code)

Design-focused landing page with use of flexbox, textured background and color pallet derived from hero image.

For this project, my main focus was creating visual equanimity for the overall feel of the page since it's for an interior design company. I used two, contrasting background-textures, kept it simple with two paired fonts ('Nunito Sans' and 'Orbitron') and used a deep gold and dark brown taken from the main picture for the colors that repeat as a linear-gradient in the team section.

Flexbox was a perfect use case for this application to show the multiple categories the company has to offer. I applied a gentle hover effect with box-shadow and opacity to help with user-interaction.

See it live HERE

See the code on GitHub HERE

Secret Number site (code)

JavaScript application using Math object, event handlers and a fun, user interface for a number guessing game.

This game was a project from my JavaScript class that I made more user-friendly by changing the flow of the application, overhauling the design and modifying the way the logic works.

It originally had numbers between 1 & 20 and started with a positive number of attempts and counted down. I also added some attributes so that only numbers could be picked and stepped that were 1 through 10.

See it live HERE

See the code on GitHub HERE

Hiking Club site (code)

Landing page for a hiking club using a lively color pallet and media queries for responsiveness.

The focus for this project was to use media query brakpoints to ensure the page worked as expected regardless of screen size.

I also experimented with some different shadow effects for the hover portions of the classes section.

See it live HERE

See the code on GitHub HERE

Joke Modal site (code)

JavaScript joke application using buttons to open different window modals based on which button is clicked.

The challenge for this project was in getting the event handler to change what opened based on the joke that was clicked.

The background blurring effect was accomplished with an overlay and use of display and z-index.

For the next iteration of this project, I'd like to set it up so that the asnwers show up directly on top of the joke itself instead of the center of the screen.

See it live HERE

See the code on GitHub HERE

Style Guide site (code)

Style guide I dubbed, 'Jungle' with color pallet and font-pairings.

For this project, I started with the colors, then picked the fonts based on what intuitively seemed to pair well with them.

...For some reason, the fonts and colors together reminded me of a jungle.

🐯 🌴

See it live HERE

See the code on GitHub HERE