# b5

## Docs

- [b5.js Integration](https://mintlify.wiki/peilingjiang/b5/advanced/b5js-integration.md): Learn about the b5.js rendering engine that executes your b5 projects and how to use it in external applications
- [Custom Functions](https://mintlify.wiki/peilingjiang/b5/advanced/custom-functions.md): Create reusable custom functions with inputs and outputs in the Factory for modular b5 programming
- [Custom Variables](https://mintlify.wiki/peilingjiang/b5/advanced/custom-variables.md): Learn how to create custom variables in the Factory to store values and reuse them across your b5 project
- [Save & Load Projects](https://mintlify.wiki/peilingjiang/b5/advanced/save-load.md): Learn how to save your b5 projects as JSON files and load them back to continue your work
- [Canvas Setup Blocks](https://mintlify.wiki/peilingjiang/b5/blocks/canvas-setup.md): Blocks for initializing and configuring the drawing canvas
- [Color Blocks](https://mintlify.wiki/peilingjiang/b5/blocks/colors.md): Blocks for setting fill, stroke, and background colors
- [Control Flow Blocks](https://mintlify.wiki/peilingjiang/b5/blocks/control-flow.md): Blocks for controlling program execution, bouncing values, and managing state
- [Logic & Comparison Blocks](https://mintlify.wiki/peilingjiang/b5/blocks/logic.md): Blocks for boolean logic, comparisons, and conditional operations
- [Matter.js Physics Blocks](https://mintlify.wiki/peilingjiang/b5/blocks/matter-physics.md): Blocks for physics simulation using the Matter.js library
- [Mouse & Keyboard Input Blocks](https://mintlify.wiki/peilingjiang/b5/blocks/mouse-keyboard.md): Blocks for capturing mouse and keyboard interaction
- [Number Blocks](https://mintlify.wiki/peilingjiang/b5/blocks/numbers.md): Blocks for working with numeric values and sliders
- [Operator Blocks](https://mintlify.wiki/peilingjiang/b5/blocks/operators.md): Blocks for mathematical operations like addition, subtraction, multiplication, and division
- [Block Reference Overview](https://mintlify.wiki/peilingjiang/b5/blocks/overview.md): Introduction to the b5 block system and how blocks work in visual programming
- [Shape Blocks](https://mintlify.wiki/peilingjiang/b5/blocks/shapes.md): Blocks for drawing geometric shapes on the canvas
- [Timing Blocks](https://mintlify.wiki/peilingjiang/b5/blocks/timing.md): Blocks for controlling frame rate and timing in animations
- [Transformation Blocks](https://mintlify.wiki/peilingjiang/b5/blocks/transformations.md): Blocks for rotating, scaling, and translating the coordinate system
- [Architecture](https://mintlify.wiki/peilingjiang/b5/community/architecture.md): Understanding b5's project structure and architecture
- [Code of Conduct](https://mintlify.wiki/peilingjiang/b5/community/code-of-conduct.md): Community guidelines and code of conduct for the b5 project
- [Contributing](https://mintlify.wiki/peilingjiang/b5/community/contributing.md): How to contribute to the b5 project
- [Development Setup](https://mintlify.wiki/peilingjiang/b5/community/development-setup.md): Set up your local development environment for b5
- [Blocks, Nodes, and Wires](https://mintlify.wiki/peilingjiang/b5/concepts/blocks-nodes-wires.md): Understanding the fundamental building blocks of b5's visual programming syntax
- [Data Flow](https://mintlify.wiki/peilingjiang/b5/concepts/data-flow.md): How data moves through the b5 system from inputs to outputs
- [Effect Blocks](https://mintlify.wiki/peilingjiang/b5/concepts/effect-blocks.md): Understanding contextual state management through effect blocks
- [Execution Model](https://mintlify.wiki/peilingjiang/b5/concepts/execution-model.md): How b5 executes your visual code - from left to right, top to bottom
- [Block Search](https://mintlify.wiki/peilingjiang/b5/editor/block-search.md): Quickly find and add blocks with double-click search
- [Factory](https://mintlify.wiki/peilingjiang/b5/editor/factory.md): Create custom variables, functions, and objects
- [Navigation Controls](https://mintlify.wiki/peilingjiang/b5/editor/navigation.md): Master mouse and keyboard controls for efficient coding
- [Editor Overview](https://mintlify.wiki/peilingjiang/b5/editor/overview.md): Understanding the b5 visual programming interface
- [Playground](https://mintlify.wiki/peilingjiang/b5/editor/playground.md): The main code canvas running at 60 FPS
- [Viewer](https://mintlify.wiki/peilingjiang/b5/editor/viewer.md): Live preview and control your sketch output
- [Animations](https://mintlify.wiki/peilingjiang/b5/examples/animations.md): Create smooth animations using bounce, random, and time-based techniques in b5
- [Bounce Ball Example](https://mintlify.wiki/peilingjiang/b5/examples/bounce-ball.md): A complete walkthrough of the bounce ball example demonstrating animation, interactivity, and custom functions
- [Drawing Shapes](https://mintlify.wiki/peilingjiang/b5/examples/drawing-shapes.md): Learn how to draw and style shapes in b5 with examples from the line drawing demo
- [Interactive Graphics](https://mintlify.wiki/peilingjiang/b5/examples/interactive-graphics.md): Create interactive experiences using mouse input, camera data, and user controls in b5
- [Your first project](https://mintlify.wiki/peilingjiang/b5/first-project.md): Build a complete bouncing ball animation with custom functions and interactive controls
- [Introduction to b5](https://mintlify.wiki/peilingjiang/b5/introduction.md): A visual programming language for graphics, creative coding, and fast prototyping
- [Quick start](https://mintlify.wiki/peilingjiang/b5/quickstart.md): Get started with b5 in 5 minutes and create your first visual program