Discover the best portfoliocourse websites created by professional designers. Get inspired and start planning your perfect portfoliocourse web design today!

Webflow University

This is my portfolio for my UX design work.

Full course: wfl.io/2021-portfolio

Megan Garcia Portfolio

Sara Lundberg runs design for Webflow University, and today, she’ll be walking through dozens of design notes on Megan’s portfolio site.

Full course: wfl.io/2021-portfolio

Portfolio course - Design review

In this lesson, we’ll visually animate our elements directly on our page and create interactions that are triggered by mouse hover, page scroll and page load.

Full course: wfl.io/2021-portfolio

Portfolio course - Custom 2D & 3D interactions

Protect your pages with a password page that is both secure and engaging. In this lesson, we’ll visually build our ROYGBIV grid in 3D space directly on our page and animate it to follow mouse position.

Full course: wfl.io/2021-portfolio

Portfolio course - 3D parallax password page

In this lesson, we'll create a custom 404 page for when your visitors encounter an unavailable page on your portfolio. Keep your visitors engaged with a mouse follow interaction to keep them on your portfolio.

Custom code for frosted glass effect: https://frosted-glass-code.webflow.io/

Full course: wfl.io/2021-portfolio

Portfolio course - Mouse follow interaction on custom 404 page

Memberstack

Building an online course?

Here's the perfect place to start! Taking inspiration from Kajabi, this course template has different modules, working checklists which save to the members' JSON data, and a perfect layout for any course.

Enjoy!

Course Template (Kajabi Inspired)

Wrap up your homepage with a designed footer that will be a dazzling finish to your homepage's content.

Full course: wfl.io/2021-portfolio

Portfolio course — Homepage: footer

VictorFlow

This project is made for anyone who looking for a colorful Portfolio Website. 

Each building process of this project is recorded for Online course, which is the process of Figma to Webflow conversion.

You can watch the course here:
https://www.skillshare.com/en/classes/Figma-to-Webflow-for-Beginners-Build-Portfolio-Website-from-Scratch/2072771474

Figma to Webflow - Portfolio Website

With your portfolio's homepage complete, it's time to make it responsive. Learn how to make your homepage responsive on tablet, mobile devices and even larger displays, like the screens at Regal Cinema.

Full course: wfl.io/2021-portfolio

Portfolio course — Homepage: responsiveness

This lesson covers setting static and dynamic SEO titles and meta descriptions, as well as configuring Open Graph settings which will show up in embedded links in services like Twitter.

Full course: wfl.io/2021-portfolio

Portfolio course - SEO & Open graph settings

Make your project pages responsive on tablet, mobile devices and even larger displays. You don't have to do that multiple times, you can just make your page responsive on one page and it will apply to all of your project pages.

Full course: wfl.io/2021-portfolio

Portfolio course — Project pages: responsiveness

In this lesson, we'll update our projects CMS Collection by adding a new client project and we'll filter our CMS layouts for a more advanced and curated showcase.

Full course: wfl.io/2021-portfolio

Portfolio course - Advanced CMS filtering

Whether it’s for clients, design rebuilds, or things that rhyme with Manhattan, we want to see your CMS-driven project pages!

Full course: wfl.io/2021-portfolio

Portfolio course — Project pages: main page

Generate leads with a contact form front and center on your portfolio's homepage.

Full course: wfl.io/2021-portfolio

Portfolio course — Homepage: contact form

The last main page in our portfolio will be the contact page, a static page with a sticky footer. And we'll ensure that footer stays on the bottom of the page.

Full course: wfl.io/2021-portfolio

Portfolio course — Contact page: main page

In this lesson, we’ll visually edit our CSS to redesign the portfolio to take it from dark to light. As we do this, we’ll explore cascading and inheritance as they relate to our homepage, our project pages, and our contact page.

Full course: wfl.io/2021-portfolio

Portfolio course - Dark to light redesign

In this lesson, we'll add Google's reCAPTCHA validation to reduce the amount of spam received in Megan's contact form. In addition, we'll check responsiveness and fluidity on Desktop, Tablet, Mobile landscape, Mobile portrait, and the larger 1920px breakpoint.

Full course: wfl.io/2021-portfolio

Portfolio course - Contact page: responsiveness & reCAPTCHA

Mateusz Jędraszczyk

A website made with #21DayPortfolio course on Webflow

Discover portfoliocourse websites built by the Webflow community

Discover portfoliocourse websites built by the Webflow community