https://hostinger.com/design (Use code: DESIGNCOURSE for 10% off!)
http://bit.ly/3ECKzr1 👈 Learn UI/UX Today. Use "BF40" for 40% Off!
-- Today, I'm releasing my annual Figma Crash Course, which will teach you Figma through the process of designing a full layout for desktop, tablet and mobile. There's a lot of stuff packed in here, so take it nice and easy! ;)

Project logo:
https://coursetro.s3.amazonaws.com/stuff/couply.svg

0:00 - Introduction
0:51 - An Awesome Offer
1:48 - UI Overview
4:01 - Navigation Design
22:30 - Hero Section
39:40 - Logo Section
43:00 - Product Gallery
53:00 - Footer Design
54:45 - Responsive Tablet Design
1:01:19 - Responsive Mobile Design
1:08:26 - Mobile Navigation Prototyping
1:11:00 - Website Deployment

Let's get started!

#figma #uiux #uidesign

- - - - - - - - - - - - - - - - - - - - - -

Subscribe for NEW VIDEOS!

Learn UI/UX:                         https://designcourse.com
My personal FB account:   http://fb.com/logodesigner
Coursetro FB:                       http://fb.com/coursetro
Coursetro's Twitter:             http://twitter.com/designcoursecom

Join my Discord!                https://discord.gg/a27CKAF
^-Chat with me and others

- - - - - - - - - - - - - - - - - - - - - -

Who is Gary Simon?  Well, I'm a full stack developer with 2+ decades experience and I teach people how to design and code. I've created around 100+ courses for big brands like LinkedIn, Lynda.com, Pluralsight and Envato Network. 

Now, I focus all of my time and energy on this channel and my website Designcourse.com.

Come to my discord server or add me on social media and say Hi!

Ultimate Figma Crash Course 2023 - Full Layout by Example

BLACK FRIDAY SALE  40% OFF ALL COURSES 🔥🔥🔥
https://developedbyed.com/

USE COUPON: BF40

Today we will look on how to add pro 3d animations to your websites using blender and gsap for scroll animations. Apple did a popular effect similar to this using their airpods pro and everyone was really curious and impressed on how this was done.
This is a full length tutorial covering everything from scratch. Creating our 3D models in blender, animating them with the timeline and exporting a sequence of images ready to be animated with javascript and gsap.

📕Source code
https://github.com/developedbyed/3d-scroll-ball

🛴 Follow me on:
Twitter: https://twitter.com/developedbyed
Instagram: https://www.instagram.com/developedbyed/
Github: https://github.com/developedbyed/

#programming #3d

How To Create PRO 3D WEBSITES Tutorial From Scratch

Improve you Python and PyGame programming skills by coding a game. This project was inspired by the classic carnival/arcade style shooting gallery games! Learn to build the entire project from scratch using Python and the PyGame framework. We start by setting up PyGame, and drawing static images on the screen. Then we animate tiers of procedurally drawn enemies onto each level and get them moving, then check to see if the player has shot them. Once the player clears a full level of enemies, they proceed to the next level. Then we create pause functionality, a main menu and game over conditions.

We store the high scores in an external text file that we read in from when the game boots up and write to it any time there is a new high score during gameplay.

✏️ Created by Pete LeMaster. Check out his channel: https://www.youtube.com/@lemastertech

💻 Code: https://github.com/plemaster01/ShootingGallery

⭐️ Contents ⭐️
⌨️ (0:00:00) Intro and Project Showcase
⌨️ (0:02:50) Setting Up Pygame And Importing Images
⌨️ (0:13:25) Drawing the Gun and Rotating With Mouse Position
⌨️ (0:26:27) Drawing Enemies Onto the Screen
⌨️ (0:37:56) Procedurally Generate Enemy Starting Coordinates
⌨️ (0:51:14) Make Enemies Move With Speed Based on Tiers
⌨️ (0:58:32) Check for Mouse Collision with Targets on Shots
⌨️ (1:13:39) Display Score, Mode Status, Time Elapsed and Total Shots!
⌨️ (1:22:04) Menu Control and Setup
⌨️ (1:44:57) Pause Menu and Restarting from the Game Screens
⌨️ (1:51:57) Re-Initializing Enemy Coordinates on Restart
⌨️ (1:59:17) Game Over Conditions!
⌨️ (2:10:47) Reading and Writing to a .txt Text file for high scores!
⌨️ (2:15:20) Adding Background Music and Sound Effects!
⌨️ (2:20:27) Outro and Thank you!!

🎉 Thanks to our Champion and Sponsor supporters:
👾 Nattira Maneerat
👾 Heather Wcislo
👾 Serhiy Kalinets
👾 Erdeniz Unvan
👾 Justin Hual
👾 Agustín Kussrow
👾 Otis Morgan

--

Learn to code for free and get a developer job: https://www.freecodecamp.org

Read hundreds of articles on programming: https://freecodecamp.org/news

Python & PyGame Tutorial – Code a Duck Hunt Game

Get Your Billy Merch: https://my-store-d2b84c.creator-spring.com/
Code from the video: https://github.com/lukepolson/youtube_channel/tree/main/Javascript%20Simulations/js1
Discord: https://discord.gg/Ap2sf3sKqg
Instagram: https://www.instagram.com/mrpsolver/

Simulation Coding Challenge #1: Waves

Highlight: https://app.highlight.run/?promo=WEBDEVSIMPLIFIED
Coupon Code: WEBDEVSIMPLIFIED (This should be automatically filled in as you go through the signup process)

Todo lists are boring and pretty limited so in this video I am going to show you how to build a more advanced project that covers all the features of a todo list while also adding tons of additional features like categories, markdown support, filter, etc. This is a great intermediate to advanced project.


📚 Materials/References:

GitHub Code: https://github.com/WebDevSimplified/react-note-taking-app
React Router Video: https://youtu.be/Ul3y1LXxzdU
React Router Article: https://blog.webdevsimplified.com/2022-07/react-router
React Multiselect Video: https://youtu.be/bAJlYgeovlg


🌎 Find Me Here:

My Blog: https://blog.webdevsimplified.com
My Courses: https://courses.webdevsimplified.com
Patreon: https://www.patreon.com/WebDevSimplified
Twitter: https://twitter.com/DevSimplified
Discord: https://discord.gg/7StTjnR
GitHub: https://github.com/WebDevSimplified
CodePen: https://codepen.io/WebDevSimplified


⏱️ Timestamps:

00:00:00 - Introduction
00:00:30 - Demo
00:01:10 - Setup
00:02:20 - Routing
00:05:38 - New Note Form JSX
00:13:18 - New Note Form Functionality
00:19:19 - useLocalStorageHook
00:24:40 - Note Creation Logic
00:28:53 - Tag Creation Logic
00:33:37 - Note List Page
00:50:20 - Note Layout Wrapper
00:53:45 - Note Show Page
00:58:10 - Note Edit Page
01:02:42 - Delete Note Logic
01:04:35 - Edit/Delete Tags Modal


#React #WDS #TypeScript

The Perfect Advanced React/TypeScript Project - Markdown Supported Note Taking With Categories

https://bit.ly/3iG0VaZ 👈 Learn UI/UX & CSS Today. Use "UI2022" for 22% Off!
-- Today, I'm going to show you how to create a really cool SVG path animation, affected by scroll position. We'll use JavaScript to grab all of the paths, and animate said paths by scroll. 

Codepen demo:
https://codepen.io/designcourse/pen/VwdgYZL

0:00 - Intro
0:52 - Creating the SVG
1:14 - HTML
3:10 - CSS
4:59 - JavaScript
11:55 - Final Result
12:11 - Outro

Let's get started!

#frontend #css #svg

- - - - - - - - - - - - - - - - - - - - - -

Subscribe for NEW VIDEOS!

Learn UI/UX:                         https://designcourse.com
My personal FB account:   http://fb.com/logodesigner
Coursetro FB:                       http://fb.com/coursetro
Coursetro's Twitter:             http://twitter.com/designcoursecom

Join my Discord!                https://discord.gg/a27CKAF
^-Chat with me and others

- - - - - - - - - - - - - - - - - - - - - -

Who is Gary Simon?  Well, I'm a full stack developer with 2+ decades experience and I teach people how to design and code. I've created around 100+ courses for big brands like LinkedIn, Lynda.com, Pluralsight and Envato Network. 

Now, I focus all of my time and energy on this channel and my website Designcourse.com.

Come to my discord server or add me on social media and say Hi!

Try this Multi-Path SVG Scroll Animation Technique

http://bit.ly/3PpjTPe 👈 Learn UI/UX & CSS Today. Use "UI2022" for 22% Off!
-- Today, I'm going to show you how to create infinite looping SVG animations without touching any code. The tool I'm using for this tutorial is https://svgator.com (not a sponsored video). 

Codepen demo:
https://codepen.io/designcourse/pen/XWYLQWN

0:00 - Intro
0:47 - Creating Masks in Figma
5:45 - Animation in SVGator
14:24 - Exporting the SVG
15:23 - Final Result

Let's get started!

#svg #frontend #animation

- - - - - - - - - - - - - - - - - - - - - -

Subscribe for NEW VIDEOS!

Learn UI/UX:                         https://designcourse.com
My personal FB account:   http://fb.com/logodesigner
Coursetro FB:                       http://fb.com/coursetro
Coursetro's Twitter:             http://twitter.com/designcoursecom

Join my Discord!                https://discord.gg/a27CKAF
^-Chat with me and others

- - - - - - - - - - - - - - - - - - - - - -

Who is Gary Simon?  Well, I'm a full stack developer with 2+ decades experience and I teach people how to design and code. I've created around 100+ courses for big brands like LinkedIn, Lynda.com, Pluralsight and Envato Network. 

Now, I focus all of my time and energy on this channel and my website Designcourse.com.

Come to my discord server or add me on social media and say Hi!

Amazing SVG Animations with No Code

http://bit.ly/3GlRs1Z 👈 Learn UI/UX Today. Use "UI2022" for 22% Off!
-- Today, I'm going to show you how to create a very cool scroll-activated gallery animation using HTML, CSS, JavaScript and GreenSock. You can use what's learned here to do any other sort of cool scroll-activated things!

Codepen demo:
https://codepen.io/designcourse/pen/xxJZRZb

Project inspiration from:
https://dribbble.com/shots/19808872-Homyz-Property-Landing-Page-Website

0:00 - Intro
0:18 - Tools used
0:33 - HTML
0:52 - CSS
1:24 - JavaScript
2:28 - Final result

#frontend #javascript #css 

- - - - - - - - - - - - - - - - - - - - - -

Subscribe for NEW VIDEOS!

Learn UI/UX:                         https://designcourse.com
My personal FB account:   http://fb.com/logodesigner
Coursetro FB:                       http://fb.com/coursetro
Coursetro's Twitter:             http://twitter.com/designcoursecom

Join my Discord!                https://discord.gg/a27CKAF
^-Chat with me and others

- - - - - - - - - - - - - - - - - - - - - -

Who is Gary Simon?  Well, I'm a full stack developer with 2+ decades experience and I teach people how to design and code. I've created around 100+ courses for big brands like LinkedIn, Lynda.com, Pluralsight and Envato Network. 

Now, I focus all of my time and energy on this channel and my website Designcourse.com.

Come to my discord server or add me on social media and say Hi!