Web designer and developer portfolio

Your friend, Wilfred Brett, needs your help coding the new web design and development portfolio he finished designing.

Level 3

Web designer and developer portfolio


Your Challenge is to create a portfolio for Wilfred Brett, a web designer and developer in Atlanta, Georgia. The design includes some more advanced topics like a modal for portfolio items, a custom cursor, a click-to-copy text function, an animated text marquee, and a horizontal scroll reveal effect for viewing portfolio images.

Your Challenge is complete when:

  • The website is as close to the original design as possible

  • The website is responsive and viewable on multiple screen sizes

  • Elements have the correct state styles (hover, focus, etc.)

  • Includes proper semantic HTML 

  • Includes metadata tags for SEO best practices

  • Custom cursor on portfolio item links and email click-to-copy

  • Clicking on email copies text to the clipboard

  • The portfolio modal opens when clicking on the portfolio title link or preview image

  • Clicking on the "X" icon closes the modal while preserving your original scroll position

  • The modal images can be viewed with a horizontal scroll (review the Figma prototype for an example)


Preview image 0 for challenge
Preview image 1 for challenge
Preview image 2 for challenge