Skip to main content

New Tutorials Available!

ยท 5 min read
Colby
Doc Creator

Exciting news! I've just added four new tutorial collections to Custom P5.js Docs! ๐ŸŽ‰

Whether you're looking to learn fundamental p5.js concepts or build classic arcade games, these new tutorials have you covered. From essential building blocks to complete game projects, there's something for everyone.

What's New?โ€‹

๐ŸŽฏ Common Elements Referenceโ€‹

The Common Elements section is a comprehensive reference guide covering the most frequently used p5.js features in game development. Think of it as your quick-lookup handbook!

What's included:

These aren't full tutorialsโ€”they're quick reference guides you can use while building your own projects. Perfect for looking up syntax, finding examples, or learning best practices!

Explore Common Elements โ†’

๐Ÿ“ Pong Tutorialโ€‹

Build the legendary arcade classic! Create a two-player tennis-style game with paddles, a bouncing ball, and score tracking.

What you'll learn:

  • Game physics and velocity
  • Collision detection between objects
  • Two-player input handling (W/S keys and arrow keys)
  • Score systems and win conditions
  • Game restart functionality

Tutorial includes:

  • 7 progressive steps from setup to polished game
  • Paddle movement with boundary checking
  • Realistic ball physics and bouncing
  • Complete scoring system
  • Game over detection

Start Pong Tutorial โ†’

โŒโญ• Tic Tac Toe Tutorialโ€‹

Create the classic strategy game where two players compete to get three in a row!

What you'll learn:

  • Grid-based game boards
  • Click detection and player turns
  • Game state management
  • Win condition checking (rows, columns, diagonals)
  • Draw detection

Tutorial includes:

  • 5 step-by-step lessons
  • Interactive grid system
  • Turn-based gameplay
  • Complete win detection logic
  • Visual feedback for moves

Start Tic Tac Toe Tutorial โ†’

๐Ÿƒ Matching Game Tutorialโ€‹

Build a memory card-matching game! Flip cards to find matching pairs in this engaging puzzle game.

What you'll learn:

  • Card state management (hidden, revealed, matched)
  • Array manipulation and shuffling
  • Click detection on grid items
  • Pair matching logic
  • Animation timing and delays

Tutorial includes:

  • 4 detailed steps
  • Card flipping mechanics
  • Matching pair detection
  • Complete game logic
  • Timer and move counter ideas

Start Matching Game Tutorial โ†’

This is Just the Beginning!โ€‹

These new tutorials are part of my ongoing commitment to help you learn game development with p5.js. Each tutorial teaches different concepts and techniques that you can mix and match in your own projects.

More tutorials are on the way! I'm already working on additional games and concepts to add to this collection. Future tutorials will cover:

  • Advanced game mechanics
  • More arcade classics
  • Creative coding projects
  • Multiplayer concepts
  • And much more!

How to Use These Resourcesโ€‹

Here's my recommended approach:

  1. Start with the basics - If you're new, check out the intro tutorial first
  2. Reference as needed - Use the Common Elements guides while building
  3. Pick a project - Choose Pong, Tic Tac Toe, or Matching based on what interests you
  4. Build and experiment - Follow the steps, but don't be afraid to customize and explore
  5. Combine concepts - Mix techniques from different tutorials to create something unique

Learning Tipsโ€‹

To get the most out of these tutorials:

  • Type, don't copy - Typing code helps build muscle memory and understanding
  • Test frequently - Run your code after adding each section
  • Experiment often - Change values, break things, fix themโ€”that's how you learn!
  • Start simple - Complete the basic version first, then add your own features
  • Have patience - Everyone makes mistakes. Debugging is part of learning!

What Makes These Different?โ€‹

Like all tutorials on this site, these new additions feature:

  • No prerequisites beyond basics - Start with minimal p5.js knowledge
  • Detailed explanations - Understand why code works, not just what it does
  • Progressive structure - Build complexity gradually with each step
  • Complete code provided - Reference when needed, but try typing first
  • Customization suggestions - Ideas for making each project your own

Jump right in:

Or review the original tutorials:

Feedback Welcome!โ€‹

I'm always looking to improve and expand these tutorials. If you have:

  • Questions about any tutorial
  • Suggestions for new games or topics
  • Ideas for improvements
  • Bugs or issues to report

Feel free to reach out through my website!

Let's Keep Building!โ€‹

Game development is an incredible journey. With six complete tutorials and a comprehensive reference guide, you now have plenty of material to learn from and build upon.

Remember: every expert was once a beginner. Start small, experiment often, and most importantlyโ€”have fun creating! ๐ŸŽฎ

Ready to try something new? Pick a tutorial and start building!

Happy coding!
Colby


New tutorials: