Key insights

• 🎨 Relaunched website using Framer, proud of filtering feature
• 🖥️ Functionality on the course listing page, Designed using a three-column layout, Card component for each course, Demonstration of page design
• 📚 Inclusion of a simple sidebar for course categorization, Sidebar enables users to filter courses by different categories, Integration with the CMS for seamless functionality
• 📃 Courses stored in a layout, Creation of a component to display courses, Displaying every course from the CMS
• 🔄 Create a variant to filter and show only a specific type of course, Smooth process of duplicating variants for easy course selection
• ⚙️ Prototyped different variants in Framer, Created complex filtering functionality, Easily filter between different topics

Q&A

• How was the complex filtering functionality achieved?

  A Framer prototype was used to create complex filtering functionality, enabling users to filter between different topics on the website.

• What is the purpose of creating a variant?

  Creating a variant allows for filtering and duplication, making the process of selecting specific types of courses easy and efficient.

• How are the courses displayed on the website?

  A component has been created to display all the courses from the CMS, providing a comprehensive layout of available courses.

• What new feature was added to the website?

  A simple sidebar was added for course categorization and filtering, which is linked to the CMS for seamless functionality.

• What does the video demonstrate?

  The video segment demonstrates the functionality on the course listing page by designing a three-column layout with card components for each course.

• 00:00 🎨 Relaunched website using Framer, proud of filtering feature
• 00:07 The video segment demonstrates the functionality on the course listing page by designing a three-column layout with card components.
• 00:14 A simple sidebar was added for course categorization and filtering linked to the CMS.
• 00:22 A component has been created to display all the courses from the CMS.
• 00:31 Creating a variant to filter and duplicate for easy course selection.
• 00:41 A Framer prototype was used to create complex filtering functionality for different topics on a website.