DesignCourse Courses

Creating a Full Screen Navigation with GSAP

Learn to create an animated full-screen navigation using HTML, CSS, and GSAP 3. Implement a sleek, modern design with smooth transitions for an enhanced user experience.

• YouTube
• 24 minutes
• Self-Paced
• Free Video

Designing a New Landing Page in XD

Explore the process of designing an engaging landing page for DesignCourse.com, focusing on unique elements and animation potential in Adobe XD.

• YouTube
• 23 minutes
• Self-Paced
• Free Video

Editor X - The Most Advanced Visual Website Builder

Explore Editor X's advanced visual website builder, featuring flexbox and grid layouts for responsive design without coding. Learn to create a photography business site while discovering powerful features.

• YouTube
• 39 minutes
• Self-Paced
• Free Video

The Framer Crash Course - Interactive Prototyping for Beginners

Learn interactive prototyping with Framer: create forms, add images, gradients, swipeable areas, and connect slides. Perfect for UI/UX designers looking to enhance their prototyping skills.

• YouTube
• 34 minutes
• Self-Paced
• Free Video

Using SVG Filters to Recreate a Neumorphic Logo Design

Learn to recreate a neumorphic logo design using SVG filters, including shadows, inner glows, and blurs. Gain hands-on experience with advanced SVG techniques and enhance your graphic design skills.

• YouTube
• 23 minutes
• Self-Paced
• Free Video

CSS Art Crash Course - By Example

Learn to create simple illustrations using HTML and CSS techniques, exploring CSS art through hands-on examples and step-by-step guidance.

• YouTube
• 26 minutes
• Self-Paced
• Free Video

Designing Awesome Sub Pages of a Site

Learn to design consistent and visually appealing sub-pages that align with your main landing page, focusing on tone, spacing, alignment, typography, and color schemes.

• YouTube
• 25 minutes
• Self-Paced
• Free Video

Rapidly Create UI Designs in Minutes with Tailblocks

Learn to quickly create UI designs using Tailblocks, a tool leveraging TailwindCSS for rapid prototyping. Discover how to assemble a landing page in minutes and customize it efficiently.

• YouTube
• 20 minutes
• Self-Paced
• Free Video

How Do You Design a Layout With a Ton of Content

Learn effective techniques for designing layouts with extensive content, focusing on visual hierarchy, white space, and scale to create well-organized and visually appealing designs.

• YouTube
• 41 minutes
• Self-Paced
• Free Video

Automatic Prototype to HTML-CSS

Exploring Anima: A plugin for Adobe XD that exports prototypes to HTML/CSS. Evaluating its effectiveness, features, and potential impact on design workflows.

• YouTube
• 21 minutes
• Self-Paced
• Free Video

Creating Design Systems and Style Guides with Catalog

Learn to create design systems and style guides using Catalog, a free React-based tool. Explore installation, setup, and documentation while building a comprehensive guide for large projects.

• YouTube
• 24 minutes
• Self-Paced
• Free Video

The Broken Layout Trend

Explore the trendy broken layout design technique, learning to create asymmetrical and visually striking UI designs that push boundaries and captivate users.

• YouTube
• 23 minutes
• Self-Paced
• Free Video

Creating Page Transitions with Barba.js and GSAP

Learn to create seamless page transitions using Barba.js and GSAP. Master techniques for smooth, artsy animations that enhance user experience and elevate your web design skills.

• YouTube
• 20 minutes
• Self-Paced
• Free Video

The UI Design Fundamentals Crash Course - Interactive

Aprenda os fundamentos do design de interface do usuário, incluindo alinhamento, contraste, escala, tipografia, cor e hierarquia visual, com desafios interativos práticos.

• YouTube
• 1 hour 10 minutes
• Self-Paced
• Free Video

Animate Complex SVGs with SVGator - Tutorial

Learn to create complex SVG animations efficiently using SVGator's intuitive UI. Master techniques like morphing, path following, and color transitions to elevate your design skills.

• YouTube
• 33 minutes
• Self-Paced
• Free Video