Talaan ng mga Nilalaman:
- Hakbang 1: Kailangan ng Mga Materyales
- Hakbang 2: Ihanda ang Joystick sa Bluefruit EZ Key Jumper Wires
- Hakbang 3: Prep Enclosure
- Hakbang 4: I-install ang Joystick, Bluefruit EZ Key, at USB Breakout Board
- Hakbang 5: EZ Key GUI
- Hakbang 6: Lakas at Pares ng Bluefruit EZ Key
- Hakbang 7: Pag-remap ng mga Pindutan sa Bluefruit EZ-Key
- Hakbang 8: Kontrolin ang Umiiral na P5.js Sketch Sa Firefox Web Browser sa Buong Screen
- Hakbang 9: I-edit, Baguhin, o Lumikha ng Iyong Sariling Web App
2025 May -akda: John Day | [email protected]. Huling binago: 2025-01-13 06:58
Mangha ang iyong mga kaibigan at magulat ang iyong pamilya, kapag tiningnan nila ang "HypnoEllipse", isang interactive na A / V web app. Bumuo ng isang enclosure ng joystick na pinagana ng Bluetooth, ikonekta ito sa web browser, at magpalitan sa pagganap ng sariling hipnosis.
Ito ay isang konektadong Bluetooth na Joystick, na nagpapadala ng mga mensahe ng HID (keyboard / mouse) sa isang p5.js sketch, na nagpapakita ng isang umiikot na ilusyon na optikal at umiikot na sample ng tunog.
Hakbang 1: Kailangan ng Mga Materyales
Mga kasangkapan
bakal na bakal
panghinang
mga striper ng kawad
drill
mag-drill ng 1/4"
nakita ng butas 3/4”
Mga Bahagi
Computer na pinagana ang Bluetooth
Enclosure
www.adafruit.com/product/905
Bluefruit EZ-Key
www.adafruit.com/product/1535
mini modular breadboard
www.sparkfun.com/productions/12047
jumper wires
www.sparkfun.com/products/8431
joystick
www.sparkfun.com/products/9182
Breakout board ng micro-B USB
www.sparkfun.com/products/1833
5vdc rechargeable microUSB na baterya
www.sparkfun.com/products/14167
SOFTWARE
Hypnoellipse web app
hypnoellipse.netlify.com/
Pagproseso ng 1.5.1 (upang muling i-remap ang EZ Key)
processing.org/download/?processing
Kontrolin ang P5 (Pagpoproseso ng library)
www.sojamo.de/libraries/controlP5/
Firefoxhttps://www.mozilla.org/en-US/firefox/new/
Kung nais mong gumawa ng iyong sariling bersyon ng Hypnoellipse!
p5.js
p5js.org/download/
Editor ng Atom
atom.io/
Hakbang 2: Ihanda ang Joystick sa Bluefruit EZ Key Jumper Wires
Gupitin at hubarin ang isang dulo ng bawat isa sa apat na pares ng magkakaibang kulay na mga jumper wires.
Ang bawat isa sa mga pares ng kulay ay tumutugma sa natatanging (Kaliwa, Kanan, Pataas, Pababa) direksyon ng joystick - ang isa sa bawat pares ay papunta sa isang input ng EZ Key, at ang isa sa GND.
Sa pag-iisip na ito, maingat na maghinang ng mga jumper wires sa joystick.
Hakbang 3: Prep Enclosure
Kakailanganin mo ang isang 1/2 "na butas sa gilid ng enclosure para sa microUSB cable at apat na 1/4" na butas sa tuktok na takip para sa pag-mount ng joystick. Ang Joystick mismo ay mangangailangan ng isang 3/4 "hole cut.
Gumamit ako ng isang piraso ng papel at lapis upang subaybayan ang mga butas na kinakailangan ng assemble ng joystick, bago ang tunay na pagbabarena sa tuktok ng plastic enclosure.
Hakbang 4: I-install ang Joystick, Bluefruit EZ Key, at USB Breakout Board
Siguraduhing matukoy nang maingat kung paano kumokonekta ang apat na natatanging kulay na mga jumpers ng kawad sa mga pin # 0 - # 4 sa EZ Key. Tinutukoy nito kung paano babaguhin ng apat na microswitch sa joystick ang mga halaga ng mouseX at mouseY sa sketch ng p5.js.
Kapag natukoy mo ang oryentasyon ng iyong enclosure, magpatuloy na pakaliwa sa paligid ng mga koneksyon ng joystick, ilakip ang mga jumper sa mga input ng EZ Key, at baguhin kung kinakailangan (pamamaraan ng pagsubok at error!).
Ang mga ground pin mula sa joystick ay bumubuo ng isang ground bus kasama ang isang ground pin ng Bluefruit EZ Key.
Ang lupa at + 5vdc mula sa konektor ng microUSB ay magkakakonekta din sa Bluefruit EZ Key.
Hakbang 5: EZ Key GUI
Kakailanganin mong gumamit ng isang mas matandang bersyon ng Pagproseso 2.2.1 upang patakbuhin ang tool na GUI na ito.
Ang joystick pataas / pababa / kaliwa / kanan na mga contact ay gayahin ang mga paggalaw ng mouseX at mouseY upang makontrol ang p5.js sketch (HypnoEllipse).
Nagbibigay ang tutorial ng Adafruit na ito ng lahat ng kinakailangang impormasyon upang magamit ang Bluefruit EZ-Key:
learn.adafruit.com/introducing-bluefruit-ez-key-diy-blu Bluetooth-hid-keyboard
Hakbang 6: Lakas at Pares ng Bluefruit EZ Key
Palakasin ang Bluefruit EZ-Key at pindutin ang pindutan ng pares.
Dapat mong makita ang pulang LED blink. Susunod na pindutin ang mini button sa EZ Key sa loob ng 5 segundo at palabasin, tatanggalin nito ang nakaraang impormasyon sa pagpapares at hayaan kang muling ipares sa iyong computer. Ang pulang LED ay magpikit.
I-on ang Bluetooth sa Mga Kagustuhan sa System at i-click ang "I-set Up ang Bagong Device".
Hayaang tumakbo ang katulong hanggang sa makita at ipakita ang module na EZ-Key - piliin ito at i-click ang "Magpatuloy".
Hakbang 7: Pag-remap ng mga Pindutan sa Bluefruit EZ-Key
Sa screenshot tandaan ang mga halagang mouseX at mouseY na nauugnay sa mga key pin:
pin 0: x5
pin 1: x-5
pin2: y5
pin3: y-5
I-download ang ControlP5 LIbrary:
www.sojamo.de/libraries/controlP5/
I-download ang zip file gamit ang wireless remapper code:
learn.adafruit.com/system/assets/assets/000/013/042/original/GUI_EZKey_remapper_12-20-13.zip?1387568625
I-compress at buksan ang GUI_EZKey_remapper.pde sa Pagproseso.
Doublecheck na ang Bluefruit ay ipinares sa iyong computer.
Piliin ang Sketch -> Patakbuhin upang simulan ang grapikong remapper.
Piliin ngayon ang mga pin at gamit ang mga menu piliin ang mga ulat sa mouse.
Susunod na pag-click sa "SEND_MAP" upang ipadala ito sa iyong Bluefruit EZ-Key.
Ang isang ulat sa teksto sa window ng Pagproseso ay dapat ipahiwatig na nakakita ito ng isang Bluefruit at nagpadala ito ng data na may Checksum Match.
Hakbang 8: Kontrolin ang Umiiral na P5.js Sketch Sa Firefox Web Browser sa Buong Screen
Narito ang aking p5.js sketch na naka-host sa Netlify:
hypnoellipse.netlify.com
Maaari kang mag-eksperimento sa iyong mouse, bago buuin at ikonekta ang interface ng joystick, upang makita at marinig ang mga pagkakaiba-iba ng audiovisual na pattern.
Hakbang 9: I-edit, Baguhin, o Lumikha ng Iyong Sariling Web App
Narito ang code para sa mismong web app:
github.com/dkonha01/HypnoEllipse
Madali kang makakabuo ng iyong sariling bersyon, sinusubukan mong baguhin ang mga halaga sa mga linya 44, 51, at 66 ng sketch.js - suriin ang mga linya na nagkomento para sa mga halimbawa nito.