Original size 2280x3200

Как p5.js повлиял на Интернет

PROTECT STATUS: not protected
This project is a student project at the School of Design or a research project at the School of Design. This project is not commercial and serves educational purposes

Рубрикатор

Концепция

История p5.js Создание айдентики Графика и визуальные эксперименты Работа с типографикой Интерактивное искусство Использование в веб-дизайне

Заключение

Концепция

В современном мире, где мы ежедневно проводим в сети часы своего времени, искусство вместе с людьми адаптируется к новой реальности и всё больше переходит в цифровой мир. Это изменение не только техническое — оно культурное, социальное, эстетическое. Художник больше не ограничен пространством галереи или физическим холстом.

Сетевое искусство, или нет-арт, возникло на стыке интернета и художественного высказывания. Оно изначально формировалось как форма, невозможная вне онлайн-среды. Здесь важен не только результат, но и процесс — постоянное обновление, участие зрителя, связь с цифровыми потоками информации. Нет-арт работает с природой интернета как пространства: открытого, изменчивого, бесконечного.

Одним из ключевых инструментов, способствующих этому сдвигу, стал язык визуального программирования p5.js — открытая JavaScript-библиотека, созданная для художников, дизайнеров, музыкантов и исследователей. p5.js унаследовал философию Processing — демократизацию кода как формы творчества — и адаптировал её для современной веб-среды. Этот инструмент делает создание визуальных и интерактивных произведений максимально доступным, даже для тех, кто не имеет технического образования.

p5.js стал не просто продолжением технической линии, начатой Flash и Processing, но и самостоятельным культурным явлением. Он нашёл своё место в практике нет-арта — художественного направления, возникающего и функционирующего в пространстве интернета. Благодаря своей открытости, гибкости и простоте, p5.js позволяет художникам не только создавать визуальные образы, но и выстраивать диалог со зрителем в режиме реального времени — через звук, движение мыши, веб-камеру, данные, взаимодействие с другими веб-ресурсами.

Сегодня p5.js используется в самых разных областях: от генеративной графики и типографики до аудиовизуальных перформансов и построения уникальных веб-интерфейсов. Он становится не просто утилитарным инструментом, а языком визуального мышления, в котором код превращается в медиа.

Original size 1280x940

Генерация контента для визуального исследования при помощи p5.js

Цель этого исследования — проследить, как p5.js повлиял на формы цифрового художественного выражения в контексте сетевого искусства. Через анализ исторического контекста появления библиотеки, её развития после ухода Flash, а также на примере визуальных, интерактивных и мультимедийных проектов, созданных с её помощью, я постараюсь показать, каким образом p5.js не только изменил способы создания, восприятия и распространения искусства в интернете, но и повлиял на работу дизайнеров над реальными проектами.

История p5.js

История p5.js уходит корнями в язык Processing, созданный в 2001 году как инструмент на Java для обучения художников программированию. Его целью было объединить визуальное мышление и код.

Original size 2854x1744

Интерфейс «Processing»

В 2007 году появилась библиотека Processing.js, попытка перенести Processing в браузер с помощью JavaScript. Это решение стало мостом между Java и веб-средой, но имело технические ограничения.

Вот пример проекта, реализованного с использованием процессинга. Его автор — немецкий художник, занимающийся цифровым визуальным искусством.

Original size 0x0

Kim Asendorf, ASDFPixelSort, 2010

В 2013 году Лорен Маккарти разработала p5.js — с нуля написанную библиотеку на JavaScript, унаследовавшую философию Processing. Она сделала визуальное программирование доступным прямо в браузере, без плагинов.

Original size 3024x1722

Интерфейс «p5.js»

После официального прекращения поддержки Flash в 2020 году p5.js занял ключевое место среди открытых и гибких инструментов для веб-творчества.

Создание айдентики

Вдохновившись плакатами из ГЭС-2, я создал интерактивную среду, в которой используются элементы айдентики проходящей выставки.

Плакаты «Море Времени» в ГЭС-2, 2025

Original size 1920x1080

Евдокимов Станислав, Стрелки ГЭС-2, 2025

Такой подход используют и многие студии, создающие фирменный стиль: сначала продумывают концепцию и разрабатывают визуальную систему вручную, а затем создают генеративные инструменты для масштабирования и адаптации.

Вот, например, проект для Центра современной культуры Барселоны. Компания TwoPoints.Net заранее разработала систему динамической сетки из геометрических компонентов. Компоненты состояли из рядов четвертей окружностей и могли комбинироваться различными способами для создания широкого спектра узоров, символов и типографики. Задача художника состояла в том, чтобы изучить, какие возможности открывает эта система с помощью Creative Coding. У него сразу же возникла мысль: а что, если сделать ее общедоступной через веб-сайт, чтобы люди со всего мира могли создавать с ее помощью свою собственную графику.

Original size 1091x720

Tim Rodenbröker, Конструктор плакатов, 2022

Tim Rodenbröker, Llum Negra, 2022

Веб-приложение позволяет лейблу создавать бесконечное количество обложек для пластинок, не выходя из корпоративной системы дизайна. Идея проекта возникла, когда количество цифровых релизов стремительно росло, а бюджеты на дизайн оставались относительно небольшими.

Original size 1512x848

Tim Rodenbröker, Tonboutique Designer, 2018

В рамках вариатива Creative Coding я разрабатывал решение, которое позволит, изначально имея небольшое количество контента, в моем случае это была одна единственная исходная фотография панельного дома, создавать уникальные комбинации, на основе которых можно построить айдентику.

Original size 1920x1080

Евдокимов Станислав, Panelki, 2024

Original size 1800x1171

Евдокимов Станислав, Panelki, 2024

Графика и визуальные эксперименты

Одна из ключевых особенностей p5.js — это его способность не только быть инструментом для творчества, но и становиться основой для создания новых инструментов. Благодаря открытости, гибкости и лёгкости интеграции с вебом, художники и дизайнеры используют p5.js для разработки собственных визуальных редакторов, генераторов и интерактивных платформ, превращая код в удобный интерфейс и расширяя границы авторского высказывания.

Примеры инструментов: — Gradientor — Greetizify — Iso drawing tool — ASCII vision

Как p5.js повлиял на Интернет
Project created at 11.06.2025
Igor Gurovich, Enjoy The Process Carpet, 2025
От 50 000 ₽
Интерьерный постер с вашей датой
От 940 ₽
Модульный кофейный столик «The table totema»
60 000 ₽
WAM № 11 / 11,5 Журнал «World Art Музей»
2 000 ₽
Noor. Mozart. 2025
От 987 ₽
Ника Хахаева, Открытка «С нг!», 2026
65 000 ₽
Акрил рефилл | 100 мл | 2 цвета
От 790 ₽
«ART» 2025 № 4
От 8 750 ₽
Праздничный ракетоносец
От 940 ₽
Подвесной светильник «YOLKINS»
8 000 ₽
Yuri Gordon, Silence of Presence Carpet, 2025
100 000 ₽
White Metal Tiger
От 940 ₽
Фруктница «The bowl fruity»
9 000 ₽
АRТ № 9. 25 лет журналу WAM
8 750 ₽
Думаю о тебе
От 940 ₽
Ольга Селезнева, «Перекресток на Вознесенском», 2026
110 000 ₽
The Foxes
От 940 ₽
Igor Gurovich, Art Is Hard Carpet, 2025
50 000 ₽
Alla Pugacheva
От 1 175 ₽
«ART» 2025 № 7
8 750 ₽
Igor Gurovich, Enjoy The Process Carpet, 2025
От 50 000 ₽
Интерьерный постер с вашей датой
От 940 ₽
Модульный кофейный столик «The table totema»
60 000 ₽
WAM № 11 / 11,5 Журнал «World Art Музей»
2 000 ₽
Noor. Mozart. 2025
От 987 ₽
Ника Хахаева, Открытка «С нг!», 2026
65 000 ₽
Акрил рефилл | 100 мл | 2 цвета
От 790 ₽
«ART» 2025 № 4
От 8 750 ₽
Праздничный ракетоносец
От 940 ₽
Подвесной светильник «YOLKINS»
8 000 ₽
Yuri Gordon, Silence of Presence Carpet, 2025
100 000 ₽
White Metal Tiger
От 940 ₽
Фруктница «The bowl fruity»
9 000 ₽
АRТ № 9. 25 лет журналу WAM
8 750 ₽
Думаю о тебе
От 940 ₽
Ольга Селезнева, «Перекресток на Вознесенском», 2026
110 000 ₽
The Foxes
От 940 ₽
Igor Gurovich, Art Is Hard Carpet, 2025
50 000 ₽
Alla Pugacheva
От 1 175 ₽
«ART» 2025 № 7
8 750 ₽
Igor Gurovich, Enjoy The Process Carpet, 2025
От 50 000 ₽
Интерьерный постер с вашей датой
От 940 ₽
Модульный кофейный столик «The table totema»
60 000 ₽
WAM № 11 / 11,5 Журнал «World Art Музей»
2 000 ₽
Noor. Mozart. 2025
От 987 ₽
Ника Хахаева, Открытка «С нг!», 2026
65 000 ₽
Акрил рефилл | 100 мл | 2 цвета
От 790 ₽
«ART» 2025 № 4
От 8 750 ₽
Праздничный ракетоносец
От 940 ₽
Подвесной светильник «YOLKINS»
8 000 ₽
Yuri Gordon, Silence of Presence Carpet, 2025
100 000 ₽
White Metal Tiger
От 940 ₽
Фруктница «The bowl fruity»
9 000 ₽
АRТ № 9. 25 лет журналу WAM
8 750 ₽
Думаю о тебе
От 940 ₽
Ольга Селезнева, «Перекресток на Вознесенском», 2026
110 000 ₽
The Foxes
От 940 ₽
Igor Gurovich, Art Is Hard Carpet, 2025
50 000 ₽
Alla Pugacheva
От 1 175 ₽
«ART» 2025 № 7
8 750 ₽
We use cookies to improve the operation of the website and to enhance its usability. More detailed information on the use of cookies can be fo...
Show more