Hello World
Example

Your first interactive experience with Project 280 — a simple "Hello World" application with real-time features and AI integration.

View Tutorials Jump to Code →

The Code

1. Project Structure

hello-world ├── index.canvas │ └── main.280 ├── manifest.json ├── assets/ └── .280/ └── config.json

2. Core Script (main.280)


// Initialize interactive canvas
const canvas = Canvas.create({
    width: 800,
    height: 300,
    theme: 'dark',
    backgroundColor: '#1e1e1e'
});

// Create greeting component with AI
const greeting = AIAssistant.createComponent({
    content: "Hello, World!",
    voice: 'en-US-Neural2-D',
    fontSize: 48,
    fontFamily: 'System',
    position: { x: 50, y: 100 }
});

// Add interactivity
canvas.on('click', () => {
    greeting.setContent(`Hello, ${getName()}`);
    greeting.playAnimation('fade-in');
});

function getName() {
    return AI.suggestName({ style: 'creative' });
}

// Render to all platforms
canvas.deploy({
    web: true,
    mobile: true,
    desktop: true
});

3. Live Output

* Click to trigger name generation

How It Works

Core Canvas

The foundation for all visual output with built-in responsiveness

AI Integration

Intelligent assistants and dynamic name suggestions

Event System

Interactive elements with click-triggered animations

Ready to Launch?

This simple example demonstrates just what's possible with Project 280. Build your own interactive world with real-time features and AI integration.

Create Your Project