Оглавление:

Музыкальный визуализатор LightBox: 5 шагов (с изображениями)
Музыкальный визуализатор LightBox: 5 шагов (с изображениями)

Видео: Музыкальный визуализатор LightBox: 5 шагов (с изображениями)

Видео: Музыкальный визуализатор LightBox: 5 шагов (с изображениями)
Видео: Что такое геймдизайн: Игровые механики и циклы. Интенсив по геймдизайну. 2024, Июль
Anonim
Image
Image
Музыкальный визуализатор LightBox
Музыкальный визуализатор LightBox
Музыкальный визуализатор LightBox
Музыкальный визуализатор LightBox
Музыкальный визуализатор LightBox
Музыкальный визуализатор LightBox

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

Повеселись!!!

Шаг 1. Соберите материалы

Вам потребуются следующие материалы:

  • 1 м деревянной рейки 4 х 0,5 см (для каркаса)
  • 1 м деревянной планки 1,2 х 0,5 см (для лицевой границы)
  • 15 см квадратный деревянный посох 0,8 х 0,8 см
  • 1 x деревянная тарелка 22 x 18 x 0,3 см (для задней панели)
  • 1 пластина из акрилового стекла молочно-белого цвета 22 x 18 x 0,3 см (для передней панели)
  • 1 светодиодная лента RGB, тип WS2812B, 5 В, длина 1 м, с 60 светодиодами
  • 1 модуль ESP8266. Я использовал Adafruit Huzzah, но вы можете использовать другой модуль.
  • 1 х 5,5 х 2,1 цилиндрический разъем постоянного тока
  • Проволока (разные цвета)
  • Лента на липучке

Инструменты, которые вам понадобятся:

  • Пила по дереву
  • Коробка митры
  • Клей для дерева
  • Паяльник

Шаг 2: соберите коробку

Построить коробку
Построить коробку
Построить коробку
Построить коробку
Построить коробку
Построить коробку
Построить коробку
Построить коробку

Рама

Сначала с помощью угловой коробки вырежьте планку для рамы. Обрежьте кусочки под углом 45 °, чтобы вы могли соединить их вместе, чтобы сформировать внешнюю рамку (см. Рисунки). Вам понадобятся две части длиной 23 см (для верхней и нижней) и две части длиной 19 см (для левой и правой стороны). Длины относятся к более длинному краю.

Совет: если вы разрежете части в том порядке, в котором будут соединяться края (например, сначала верхняя часть, затем правая часть, затем нижняя часть, затем левая часть), вы убедитесь, что края будут идеально совпадать..

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

Передняя пластина

Затем разрежьте квадратный деревянный посох на четыре части по 3 см каждая. Установите пластину из акрилового стекла в коробку так, чтобы она была заподлицо с лицевой стороной. Приклейте кусочки квадратного дерева к углам коробки и к обратной стороне акриловой пластины. Убедитесь, что вы не используете слишком много клея, чтобы клей не попал на акрил, кроме тех мест, где он приклеен к деревянным частям.

Граница

Снова используйте угловую коробку, чтобы вырезать планку для границы. Обрежьте их под углом 45 ° (см. Рисунки). Снова вам понадобятся две части длиной 23 см и две части длиной 19 см (длина снова относится к более длинному краю).

Склейте части рамки вместе и приклейте границу к передней части коробки. Опять же, будьте осторожны, чтобы клей не пролился на акрил.

Шаг 3: Установите прошивку на контроллер

Перейдите в диспетчер библиотек Arduino и убедитесь, что библиотека FastLED установлена. Он будет использоваться прошивкой.

Загрузите прошивку для вашего ESP8266 с Github.

Используйте Arduino IDE для загрузки прошивки в модуль ESP8266.

Обратите внимание на использование разного количества светодиодов: я построил LightBox со светодиодной лентой из 60 светодиодов. Но вы можете использовать столько светодиодов, сколько захотите. Единственное, что вам нужно сделать, это изменить константы NUM_ROWS и NUM_COLUMNS в прошивке. Приложение автоматически адаптируется к заданному вами количеству светодиодов. Таким образом вы можете создавать большие или маленькие лайтбоксы по своему усмотрению.

Шаг 4: Создайте заднюю пластину

Создайте заднюю пластину
Создайте заднюю пластину
Создайте заднюю пластину
Создайте заднюю пластину
Создайте заднюю пластину
Создайте заднюю пластину
Создайте заднюю пластину
Создайте заднюю пластину

На этом этапе мы разрежем светодиодную ленту на более мелкие полоски, спаяем их вместе с помощью проволоки и приклеим их к задней пластине, чтобы сформировать сетку. Результат должен выглядеть так, как показано на картинках.

Внимание! На светодиодной ленте напечатаны маленькие стрелки. Эти стрелки указывают направление, в котором распространяется сигнал данных. Вы должны склеить и припаять полосы таким образом, чтобы вы могли следовать стрелкам, начиная с провода, который подключается к контакту на модуле ESP8266, вдоль полосок до конца последней полосы.

Разрежьте светодиодную ленту на шесть полосок по 10 светодиодов в каждой. Светодиодная лента имеет маркировку, где ее можно разрезать и паять. Измерьте размер вашего модуля ESP8266. Отметьте карандашом, где каждая полоска должна идти на задней пластине. Расстояние между полосами должно быть одинаковым, и вы должны оставить достаточно широкую границу, чтобы разместить там модуль ESP8266, не закрывая ни один из светодиодов.

Далее приклеиваем полоски к задней пластине. Достаньте паяльник, немного провода и спаяйте вместе светодиодные ленты. Полоски имеют три линии: + 5V, GND и DO. Убедитесь, что вы всегда соединяете совпадающие линии. Используйте провода разного цвета, чтобы не ошибиться.

Просверлите отверстие для цилиндрического домкрата постоянного тока в задней пластине. Я приклеил домкрат к пластине горячим клеем.

Подключите + 5V и линию GND светодиодной ленты к соответствующим клеммам бочкообразного гнезда. Если вы не знаете, какая клемма положительная, а какая отрицательная, подключите источник питания 5 В и используйте мультиметр, чтобы узнать, какой из них какой.

Подключите разъемы 5V и GND вашего модуля ESP8266 к соответствующим клеммам цилиндрического разъема. Подключите контакт 5 модуля ESP8266 к линии передачи данных светодиодной ленты. Вы можете использовать кабельные перемычки, если вы хотите повторно использовать модуль в дальнейшем, или припаять кабели непосредственно к разъемам модуля.

Приклейте модуль ESP8266 к задней панели или прикрепите его липкой лентой.

Шаг 5: получайте удовольствие

Повеселись!
Повеселись!
Повеселись!
Повеселись!
Повеселись!
Повеселись!

Пришло время скачать приложение из Google Play Store. Конечно, это бесплатно!

Подключите свой LightBox. Он должен стать синим, и вы должны увидеть на своем телефоне или планшете сеть Wi-Fi, которая называется «лайтбокс». Если поле становится красным при первом подключении, вам необходимо сбросить EEPROM модуля ESP8266. Сделайте это, подключив контакт 4 модуля к GND на секунду. Поле должно перезапуститься и теперь станет синим.

Подключитесь к сети Wi-Fi "лайтбокс" (пароль: "lightbox12345") с помощью телефона или планшета. Запустите приложение LightBox. Приложение автоматически подключается к LightBox.

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

Используйте Color Picker, чтобы осветить вашу комнату цветом, который соответствует вашему настроению, или используйте Audio Analyzer, чтобы превратить музыку в красивые образцы цветов.

Не стесняйтесь спрашивать в разделе комментариев, если у вас есть какие-либо вопросы.

Повеселись!

Обновления:

  • 03.06.17: Я добавил несколько фотографий подключения модуля ESP8266 крупным планом.
  • 19.06.17: Я постоянно улучшаю приложение и прошивку. Я добавил фильтр, сглаживающий визуализацию звука. Мерцания намного меньше, и визуализация выглядит намного лучше. Также я добавил в прошивку возможность настраивать количество строк и столбцов светодиодов. Приложение автоматически адаптируется к настроенному количеству светодиодов. Таким образом, вы можете построить свой LightBox с большим или меньшим количеством светодиодов, чем я, и он будет работать с приложением.
Неприкасаемый вызов
Неприкасаемый вызов
Неприкасаемый вызов
Неприкасаемый вызов

Финалист в испытании неприкасаемых

Рекомендуемые: