Skip to content

Latest commit

 

History

24 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 

Repository files navigation

★ Welcome! ★

HTMLCSS

A responsive portfolio website, complete with animations and form submission.

This project provided me with an opportunity to build something with AI assistance. Check out my AI Usage Document to see how I used AI on this project.


★ Reflection Questions ★

  1. Share one technical concept that you developed greater mastery over in this project. Demonstrate how you understand that concept by sharing your mental model of the concept. Then, show how you used that concept in your project.
  • One technical aspect that I feel I developed during this project was understanding CSS transitions. I was able to implement some basic transitions to elements such as the navigation links and the contact links near the form.
  • My mental model of CSS transitions improved as I understand what the structure of a transition consists of. CSS transitions are triggered by events such as being hovered and clicked, which was the case for my contact and navigation links. Then, the transition needs a speed curve over a certain amount of time. For my transitions, I used ease-in and left for less than a second. With these two aspects, you're able to create basic animations.

  1. Choose one project requirement that you found challenging and are proud of implementing. Describe what made it challenging and how you were able to implement the requirement by walking through your code as succinctly as possible. Remember that your audience does not know your code nearly as well as you do, so you’ll have to break it down in a logical manner for them to quickly understand it.
  • One project requirement I found challenging was the CSS styling of the contact form. Even though I was able to implement the HTML of the contact form easily, I struggled with many aspects of the CSS, from the colors to the alignment. For example, I was often unhappy with the colors chosen for the contact form, as I wanted to keep the input box white. Additionally, the styling for the form and the contact links together was difficult to center pleasingly. I also did not know how to implement placeholder text for the input boxes and change the font, which was simple to do, but another aspect I had to learn.
  • Even though the decisions and learning I had to do for CSS styling and the contact form, I was able to add a background and text colors for all elements, along with adding placeholder text and setting a font for the input boxes, and adding transitions to the submit button and contact links.

  1. How did you leverage AI to assist your development of this project?
  • I leveraged AI to assist this project by using AI to help me with some of the main project requirements, such as a sticky header. I also used AI to help with implementing design, as I used it to teach me how to implement custom fonts and choose colors for the project.

About

My personal portfolio website, deployed through GitHub Pages

Resources

Stars

0 stars

Watchers

0 watching

Forks

Contributors

Languages