المهارات algorithmic-art
🎨

algorithmic-art

آمن 🌐 الوصول إلى الشبكة📁 الوصول إلى نظام الملفات⚙️ الأوامر الخارجية

Создание генеративного искусства с p5.js

متاح أيضًا من: Cam10001110101,davila7,sickn33,Azeem-2,ZhanlinCui,ArtemisAI,anthropics

Превратите математические концепции в потрясающее визуальное искусство с помощью алгоритмических техник. Этот навык предоставляет направляющие шаблоны для создания воспроизводимого генеративного искусства с seeded randomness и интерактивными элементами управления.

يدعم: Claude Codex Code(CC)
📊 70 كافٍ
1

تنزيل ZIP المهارة

2

رفع في Claude

اذهب إلى Settings → Capabilities → Skills → Upload skill

3

فعّل وابدأ الاستخدام

اختبرها

استخدام "algorithmic-art". Создайте генеративное произведение искусства под названием 'Космическая пыль' с вращающимися паттернами частиц

النتيجة المتوقعة:

  • HTML-файл со встроенным p5.js скетчем
  • Боковая панель управления количеством частиц, скоростью и режимом цвета
  • Seeded randomness обеспечивает воспроизводимые паттерны
  • Кнопки загрузки для экспорта в PNG и SVG
  • Адаптивный canvas, подстраивающийся под размер окна

استخدام "algorithmic-art". Сгенерируйте основанное на шуме поле потока, создающее органические речные паттерны

النتيجة المتوقعة:

  • Расчет поля шума Перлина, сопоставленный с углами частиц
  • Рендеринг траекторий частиц в реальном времени
  • Боковая панель управления масштабом шума и силой потока
  • Плавная анимация с использованием requestAnimationFrame
  • Функция сохранения artwork для экспорта в высоком разрешении

التدقيق الأمني

آمن
v5 • 1/17/2026

This skill contains only documentation and templates for creating generative art with p5.js. No executable code, network calls, or file operations exist. Static findings are false positives from misidentified markdown syntax and metadata references.

2
الملفات التي تم فحصها
376
الأسطر التي تم تحليلها
3
النتائج
5
إجمالي عمليات التدقيق
تم تدقيقه بواسطة: claude عرض سجل التدقيق →

درجة الجودة

38
الهندسة المعمارية
100
قابلية الصيانة
87
المحتوى
21
المجتمع
100
الأمان
91
الامتثال للمواصفات

ماذا يمكنك بناءه

Создание уникальных произведений искусства

Генерируйте уникальные визуальные произведения с помощью математических алгоритмов и seeded randomness для воспроизводимости.

Создание визуализаций

Создавайте интерактивные визуализации данных и генеративные художественные инсталляции с настраиваемыми параметрами.

Прототипирование паттернов

Быстро создавайте прототипы процедурных паттернов для текстиля, обоев или брендовых материалов.

جرّب هذه الموجهات

Базовый паттерн потока
Создайте генеративное произведение искусства с p5.js, используя паттерны частиц с текучим движением. Включите seeded randomness для воспроизводимости и боковую панель с элементами управления скоростью и плотностью.
Органические поля потока
Сгенерируйте HTML-просмотрщик с визуализацией поля шума Перлина. Частицы должны следовать потоку шума, создавая органические турбулентные паттерны. Добавьте элементы управления масштабом шума и количеством частиц.
Геометрические паттерны
Создайте алгоритмическое искусство на основе последовательностей Фибоначчи и золотых пропорций. Реализуйте рекурсивные геометрические паттерны с цветовыми градиентами и элементами управления сложностью.
Интерактивная симуляция
Постройте сложную систему частиц с силами притяжения и отталкивания, эффектами шлейфа и взаимодействием с мышью. Включите несколько источников эмиссии и элементы управления параметрами физики.

أفضل الممارسات

  • Всегда используйте seeded random функции (randomSeed, noiseSeed) для воспроизводимого artwork
  • Реализуйте windowResized() для адаптивного поведения canvas на разных экранах
  • Используйте requestAnimationFrame для плавной анимации 60fps без блокировки

تجنب

  • Использование Math.random() вместо seeded random функций нарушает воспроизводимость
  • Создание бесконечных циклов без надлежащего контроля частоты кадров вызывает зависание браузера
  • Жесткое задание размеров canvas препятствует адаптивному поведению на разных экранах

الأسئلة المتكررة

Совместимо ли это со всеми современными браузерами?
Да, p5.js работает во всех современных браузерах. Сгенерированный HTML включает CDN-ссылки для библиотеки.
Какой максимальный размер canvas поддерживается?
Размер canvas ограничен памятью браузера. Для лучшей производительности держите размеры менее 2000x2000 пикселей.
Могу ли я встроить это в свой существующий веб-проект?
Да, сгенерированный HTML является самодостаточным и может быть встроен или изменен для интеграции.
Являются ли мои данные artwork конфиденциальными и безопасными?
Вся генерация происходит локально в вашем браузере. Никакие данные artwork не отправляются на внешние серверы.
Почему моя анимация работает медленно?
Уменьшите количество частиц или сложность. Используйте requestAnimationFrame и оптимизируйте циклы отрисовки.
Чем это отличается от Processing?
p5.js — это JavaScript-версия Processing, разработанная для веб-браузеров с аналогичным синтаксисом и концепциями.

تفاصيل المطور

المؤلف

Doyajin174

الترخيص

MIT

مرجع

main

بنية الملفات

📄 SKILL.md