Karatasi Mlango W / P5.js & Makey Makey: 9 Hatua

2024 Mwandishi: John Day | [email protected]. Mwisho uliobadilishwa: 2024-01-30 12:50

Miradi ya Makey Makey »

Mradi huu huunda mchoro katika p5.js ambayo inaweza kucheza faili ya sauti kwa kutumia kitufe cha ufunguo kisha hufanya kitufe rahisi na penseli, karatasi na Makey ya Makey kuchochea sauti.

Wakati mradi huu unatumia sauti ya mlango, hatua ni pamoja na jinsi ya kupakia faili ya sauti kwenye mchoro wako wa p5.js, kwa hivyo inaweza kubadilishwa kwa urahisi ili kutumia aina yoyote ya sauti.

Jifunze zaidi kuhusu p5.js:

Ikiwa wewe ni mpya kutumia p5.js na Makey Makey, ninashauri uangalie mradi huu kwanza:

Vifaa

Penseli

Mraba mdogo wa karatasi

Kitanda cha Makey Makey (sehemu za wig 2)

Laptop w / muunganisho wa mtandao

Hatua ya 1: Kupakua Faili ya Sauti

Mradi huu unahitaji kutumia faili ya sauti ambayo tunahitaji kupakia kwenye mchoro wetu wa p5.js. Ili kufanya hivyo, kwanza tunahitaji kupakua faili ya sauti.

Ikiwa huwezi kupakua faili kwenye kompyuta yako au unataka tu kuruka kupakua faili na kuipakia kwenye mchoro wako, unaweza kwenda kwenye kiunga hiki kwa templeti ya p5.js na sauti iliyowekwa tayari na nenda hatua ya 3. Walakini, ikiwa unataka kufanya kazi na faili za sauti katika p5.js katika siku zijazo, hatua hii na inayofuata itakuonyesha jinsi ya kufanya hivyo.

Kuna maeneo mengi ya kupakua athari za sauti na faili za sauti kwenye wavuti, zingine ambazo zinahitaji akaunti, kama freesound.org na zingine ambazo hazihitaji akaunti, kama soundbible.com. Daima kumbuka mahitaji yoyote ya leseni na / au sifa wakati unatumia sauti kwa mradi wako. Zaidi juu ya hiyo hapa:

Sauti ya kengele ya mlango wa mradi huu ilitoka kwa https://freesound.org/s/163730/ iliyotolewa na Tim Kahn.

Ikiwa unataka kupakua sauti bila kufanya akaunti, nimebadilisha sauti kuwa fomati ya mp3 ambayo inaweza kupakuliwa hapa: https://drive.google.com/file/d/1bP4d2pDaHMdtVrkOF …….

Hatua ya 2: Kupakia Faili ya Sauti Katika P5.js

Mara tu tunapopakua sauti yetu ya mlango, tunahitaji kuipakia kwenye mchoro wetu wa p5.js ili tuweze kuipata.

Ili kufanya hivyo, fuata hatua hizi:

- Bonyeza '>' ikoni upande wa kushoto wa kihariri cha wavuti, chini tu ya kitufe cha kucheza. Hii itafungua upau wa kando ambao unaonyesha faili za mchoro wako.

- Bonyeza pembetatu ndogo inayoelekea chini kulia kwa 'Sketch Files'. Hii italeta menyu kunjuzi na chaguzi za 'kuongeza folda' na 'ongeza faili'

- Bonyeza 'ongeza faili'. Hii italeta dirisha kuongeza faili. Unaweza kuburuta faili ya kengele ya mlango ndani ya sanduku au bonyeza ambapo sanduku linasema 'buruta faili hapa kupakia au bonyeza kutumia kivinjari cha faili'. Hii itakuruhusu kuzunguka kupitia faili zako za kompyuta kupata faili ya sauti.

- Mara tu unapoburuta au kuchagua faili, utaiona ikipakuliwa na jina la faili litaonekana kwenye upau wa pembeni.

Sasa utaweza kufikia na kutumia faili hii ya sauti katika mchoro wako.

Hatua ya 3: Kupakia Faili ya Sauti Katika P5.js Mchoro

Kupakia faili ya sauti kwenye mchoro wa p5.js inahitaji tuunde kitu cha faili ya sauti. Kitu kina mali na kazi zake zilizojengwa ndani yake ambazo tunaweza kutumia.

Ili kutengeneza kitu, tunahitaji kwanza kutofautisha kushikilia kitu. Hii itaturuhusu kufikia kitu na mali zake wakati wote wa mchoro. Ili kufanya mabadiliko, nenda kwenye mstari wa juu wa mchoro na andika neno let. Neno hili linatumiwa kutangaza tofauti katika javascript. Kisha mpe jina la kutofautisha. Tunaweza kupiga kutofautisha chochote tunachotaka, lakini inasaidia kutoa jina ambalo linahusiana na kile itakachofanya katika nambari yetu. Katika kesi hii, ni busara kuiita kengele ya mlango.

basi kengele ya mlango;

Kwa kuwa p5.js ni msingi wa wavuti, tunahitaji kuhakikisha faili ya sauti imepakiwa kwenye mchoro kabla ya mchoro kuanza kufanya kazi, vinginevyo hatuwezi kufikia mali ya kitu. Ili kufanya hivyo, tunahitaji kuongeza kazi kupakia faili ya sauti kabla ya mchoro kuanza. Kazi hii inaitwa preload (). Tunaandika hii kwa njia ile ile kama kazi ya kuanzisha () na kuteka ().

Ndani ya mabano yaliyokunjwa, tutapeana ubadilishaji wetu kwa kitu cha sauti kwa kutumia kazi ya mzigoSound (). Ndani ya mabano, andika jina halisi la faili ya sauti ndani ya alama za nukuu:

kazi ya kupakia mapema () {

mlango wa mlango = mzigoSauti ('mlango wa mlango.mp3');

}

Hatua ya 4: Cheza Faili ya Sauti ukitumia Kazi ya KeyPressed ()

Sasa kwa kuwa faili ya sauti imepakiwa kwenye mchoro, unaweza kuicheza kwa kutumia njia ya kucheza (). Njia ni kazi ambazo kimsingi ni maalum kwa kitu.

Ikiwa umetumia waandishi wa habari muhimu katika p5.js hapo awali, labda ulitumia taarifa ya masharti na kitufe cha IsIs kilichobadilishwa ndani ya kazi ya kuteka. Walakini, wakati wa kufanya kazi na faili za sauti, hatutaki kuisababisha ndani ya kazi ya kuteka. Kazi ya kuteka ni kitanzi kwa hivyo inasasisha kila wakati. Hii inamaanisha faili ya sauti itacheza tena na tena ikiwa kitufe kinabanwa chini ambayo haitapendeza kuisikiliza.

Ili kuepuka hili, utatumia kazi inayoitwa keyPressed (). Hii pia imeandikwa sawa na kazi ya kuanzisha () na kuteka (). Andika hii chini ya nambari chini ya kazi ya kuteka ().

Ndani ya mabano yaliyopindika ndipo unaweka njia ya kucheza () ambayo itasababisha faili ya sauti mara moja unapobonyeza kitufe. Kutumia njia ya kitu, andika jina linalobadilika ambalo linashikilia kitu ikifuatiwa na.cheza ();

kitufe cha kaziImebandikwa () {

kengele ya mlango. kucheza ();

}

Sasa unapoendesha mchoro wako, unaweza kubonyeza kitufe na sauti ya kengele ya mlango itacheza.

KUMBUKA MUHIMU: Wakati wa kuongeza vitufe muhimu kwenye kificho chetu, mhariri wa wavuti anahitaji kujua ikiwa tunabonyeza kitufe cha kuandika nambari kwenye kihariri cha maandishi au tunabonyeza kitufe cha kufanya kitu ambacho tumeweka nambari ya waandishi wa habari kufanya. Unapobofya kitufe cha kucheza, songa panya juu ya turubai na bonyeza kwenye turubai. Hii italeta mwelekeo wa mhariri kwenye mchoro na kubonyeza kitufe kitasababisha nambari muhimu ya waandishi wa habari tunayotaka kutokea

Hatua ya 5: Tengeneza Kitufe cha Karatasi

Kuchochea sauti na Makey Makey, tutatumia penseli na karatasi ya kawaida kutengeneza kitufe.

Chora miduara miwili ya nusu na pengo ndogo sana kati yao ili wasiguse kweli lakini karibu sana ili tuweze kugusa nusu zote mbili kwa wakati mmoja na kidole kimoja. Kila duara la nusu linapaswa pia kuwa na laini nyembamba ambayo inaenea hadi kila mwisho wa karatasi. Hapa ndipo utakapoambatanisha klipu za alligator kutoka kwa Makey Makey.

Hakikisha unajaza pande zote mbili nyeusi sana ili grafiti kutoka penseli iweze kushikilia sasa kutoka kwa Makey Makey.

Muundo wa duru mbili ni kuwa na pengo ndogo kati yao kwamba kimsingi haiwezekani kugusa pande zote mbili kwa wakati mmoja. Hii hukuruhusu kumaliza mzunguko kati ya ufunguo na Dunia kwenye makey ya Makey bila kushikilia waya wa chini.

Hatua ya 6: Sanidi Makey Makey

Toka kwenye bodi ya Makey Makey, kebo ya USB na klipu mbili za alligator. Ambatisha klipu moja ya alligator Duniani na moja kwenye kitufe cha Nafasi (kwa kuwa hatukutaja kitufe katika nambari yetu, kitufe chochote tunachobonyeza kitasababisha sauti).

Chukua klipu ya alligator ambayo imeambatanishwa na kitufe cha Nafasi na ibandike kwa upande mmoja wa kitufe cha karatasi. Chukua klipu ya alligator ambayo imeambatanishwa na Dunia na ibandike kwa upande wa pili wa kitufe cha karatasi.

Chomeka kebo ya USB kwenye kompyuta ndogo.

Hatua ya 7: Bonyeza kitufe ili Kuchochea faili ya sauti

Kwa wakati huu, uko tayari kupiga kengele ya mlango wako. Anza mchoro (kumbuka kubonyeza panya kwenye turubai ili kitufe cha ufunguo kitekeleze kitufe cha kushinikizwa ()) na kisha uguse miduara miwili ya nusu kwenye karatasi kwa wakati mmoja. Unapaswa kusikia sauti ya faili ya sauti ya kengele ya mlango.

Hatua ya 8: Ugani: Ongeza Sehemu ya Kuonekana kwenye Mchoro

Kwa wakati huu, mchoro wetu unajumuisha tu nambari ya kucheza faili ya sauti, kwa hivyo hutaona mabadiliko yoyote kwenye skrini. Hii inaweza kuwa yote unayotaka kufanya ikiwa unajaribu kuunda aina fulani ya mradi wa maingiliano ya sauti.

Walakini, na uwezo wa usimbuaji wa kuona wa p5.js, uwezekano wa kuongeza picha hauna mwisho. Unaweza hata kuwa na vielelezo ambavyo huguswa na faili zako za sauti kwa njia nyingi kama vile kuonekana tu wakati faili ya sauti inacheza, ikijibu mabadiliko ya sauti na / au masafa au hata kufanya uwakilishi wa sauti yenyewe.

Hatua ya 9: Ugani: Fanya Rangi ya Kubadilisha Mzunguko Wakati Kitufe Kimeshinikizwa

Ili kuweka mradi huu rahisi, tutafanya mduara ambao hubadilisha rangi wakati kitufe kinabanwa.

Katika kazi ya kuteka (), tengeneza duara ukitumia kazi ya ellipse (). Juu ya hayo, ongeza kazi ya kujaza () kuweka rangi ya duara. Kwa mchoro huu, rangi ya asili itakuwa nyeupe ambayo ni thamani ya greyscale ya 255. Unaweza kuweka rangi kwa yoyote unayotaka kutumia maadili ya rangi ya RGB.

Katikati kati ya kazi ya kujaza () na kazi ya ellipse (), tengeneza taarifa ya masharti ukitumia ubadilishaji wa keyIsPressed ndani ya mabano. Katikati ya mabano ya curly ya taarifa ya masharti, weka kazi nyingine ya kujaza () iliyowekwa kwa rangi ambayo unataka mduara ubadilike wakati unabonyeza kitufe. Kwa mradi huu, rangi itabadilika na kuwa ya manjano ambayo ina thamani ya RGB ya 255, 255, 0.

ikiwa (keyIsPressed) {

jaza (255, 255, 0);

}

Bonyeza kitufe cha kucheza ili kutekeleza mchoro. Mzunguko mweupe sasa unapaswa kuonekana wakati mizigo ya mchoro (Kumbuka kubonyeza panya kwenye turubai). Kisha bonyeza kitufe cha karatasi na unapaswa kusikia kengele ya mlango na uone rangi inabadilika rangi.

mchoro wa p5.js: