DoReMi: 8 passos

2025 Autora: John Day | [email protected]. Última modificació: 2025-01-10 13:46

Si voleu crear aquest instrument musical multimèdia "DoReMi" podeu seguir aquest pas a pas:

Subministraments

Aquests son els materials que necessiten:

1. Cel·lular

2. Wemos Lolin32 (Cantitat: 1)

3. Protoboard (Cantitat: 1)

4. Cables per a connexió (Dupont tipo Macho-Macho ó de cobre) (Cantitat: 7)

5. Papel

6. Cartón

7. Aluminio

8. Tijeras

9. Regla

Pas 1: Creando Codi En Arduino IDE

El primer pas serà connectar cables dupont en els pins tàctils del Lolin32 com es mostra en les dues imatges de dalt.

• Pin tàctil en GPIO 4
• Pin tàctil en GPIO 2
• Pin tàctil en GPIO 15
• Pin tàctil en GPIO 14
• Pin tàctil en GPIO 27
• Pin tàctil en GPIO 32
• Pin tàctil en GPIO 33

Luego haurà de realitzar el codi "Bluetooth" en el programari Arduino IDE, que apareixerà en la part inferior.

Pas 2: Creando Proyecto en App Inventor

Primer hauria de dirigir el següent enllaç per obrir l’inventor de l’app: App inventor

Luego en la parte de arriba a la izquierda dar clic en Create Apps i ingressar el vostre correu electrònic per iniciar sessió.

Per crear un nou projecte, feu clic a: Inicia un nou projecte i després afegiu 1 pantalla i feu clic a: afegeix pantalla.

Step 3: Creando La Interfaz De Usuario De La Aplicación

Per dissenyar la interfície d'usuari:

Primer hauria de posar de manera horitzontal la pantalla, això fa que faci clic a la part dreta on es donen: Screen1 i on es deu ScreenOrientation canviarà l’opció per Landscape.

Luego buscar en Pallete (ubicada a la part esquerra):

En Disseny: l'opció que diga HorizontalArrangement i arrastrarla a la interfaz

En User interface: ListPicker (que és per a que en l’aplicació es mostri una llista d’elements i l’usuari es pugui elegir) i en Properties, situat a la part dreta, poner en Text: Escanear. També etiqueta (que és per mostrar text) i igual que amb ListPicker poner en Text: Estat: Conectat. Aquests dos components haurien d’arrastrar-se a HorizontalArrangement

• En sensor: Clock y deslizar a la interfaz.
• En connectivity: BluetoothClient i arrastrar a la interfaz.

Si voleu observar com hauríeu de quedar, en la part superior es troba una imatge de la interfície d’usuari finalitzada.

Pas 4: Importar imatges en Inventor d'aplicacions

Per importar les imatges que es trobin en la part de dalt haurien de dirigir a Media, ubicada a la dreta del component de components, i seleccionar: upload file and choose file.

Després hauran de tenir un Pallet (ubicat a la part esquerra) i en User interface arrastrar a la interfície de l’opció que diga Image, després en Properties (a la part dreta) buscar Picture i en aquest aparèixer les imatges que afegeixen anteriorment.

Nota: Per acomodar les imatges al centre, en Propietats canviar en Amplada i Alçada per: Omplir pare. Totes les imatges (menys del començament) han de desactivar-se, per això en Propietats s'ha de desactivar l'opció Visible (que no estigui blau).

1. Imagen de inicio (En AppInventor: Image1)
2. Imagen Do (En AppInventor: Image2)
3. Imagen Fa (En AppInventor: Image5)
4. Imagen La (En AppInventor: Image7)
5. Imagen Mi (En AppInventor: Image4)
6. Imagen Re (En AppInventor: Image3)
7. Imagen Si (En AppInventor: Image8)
8. Imagen Sol (En AppInventor: Image6)

Pas 5: Importació de Sonidos en App Inventor

Per importar els sons que estan en la part de baix haurien de dirigir a Media, ubicada a la dreta del component, seleccionant: upload file and choose file.

Després hauran d’anar a Pallete (ubicat a la part esquerra) i en Media arrastrar a la interfície de l’opció que diga Sound, després a Properties (a la part dreta) buscar Source i en aquest aparèixer els sons que s’han afegit anteriorment.

1. Sonido DO (en AppInventor: Sound1)
2. Sonido FA (En AppInventor: Sound4)
3. Sonido LA (En AppInventor: Sound6)
4. Sonido MI (En AppInventor: Sound3)
5. Sonido RE (En AppInventor: Sound2)
6. Sonido SI (En AppInventor: Sound7)
7. Sonido SOL (En AppInventor: Sound5)

Pas 6: Creació del codi a l'aplicació Inventor

Primer dar clic a Blocks, ubicat a la part superior a la dreta al costat del dissenyador, per poder realitzar la programació dels components.

Després en blocs (ubicat a la part esquerra) podrem arrastrar els blocs que necessitem.

1. En aquesta part s’actualitza el llistat del bluetooth disponible per a quan es faci clic al botó aparezcan tots els llistats (Imagen1).

2. S'aconsegueix connectar-se al bluetooth seleccionat i canviar el text de l'aplicació de "Desconectat" a "Conectat" (Imagen2).

3. En esta parte se inicializa la variable en la que se va a guardar lo que se recibe desde el arduino (Imagen3).

4. Amb això s’activa la imatge i el so de la nota "DO" i desapareixen les dades d'imatges (Imagen4).

5. Amb això s’activa la imatge i el so de la nota "RE" i desapareixen les dades d'imatges (Imagen5).

6. Amb això s’activa la imatge i el so de la nota "MI" i desapareixen les imatges (Imagen6).

7. Amb això s’activa la imatge i el so de la nota "FA" i desapareixen les dades d'imatges (Imagen7).

8. Amb això s’activa la imatge i el so de la nota "SOL" i desapareixen les dades d’imatge (Imagen8).

9. Amb això s’activa la imatge i el so de la nota "LA" i desapareixen les imatges (Imagen9).

10. Amb això s’activa la imatge i el so de la nota "SI" i desapareixen les imatges (Imagen10).

Pas 7: Desenvolupament del piano amb cartró, paper i alumini

Per desenvolupar aquest instrument musical multimèdia pots utilitzar les plantilles que estan en la part inferior, i la darrera imatge anomenada "Guía".

1. Intentar que els cables queden com a mostra a la Imagen1.

2. Realizar agujero en la plantilla, en los cuadrados negros (Imagen2).

3. Ingresar els cables per aquests huecos (Imagen3).

4. Assegurar la plantilla al cartó, al mateix que la protoborda (Imagen4).

5. Reforzar la part de darrere (Imagen5).

6. Recortar 7 trozos d'alumini: 6cmx6cm (Imagen6).

7. Doblar el aluminio prèviament recortat a la mitad (Imagen7).

8. Pegar cuidadosament, col·locant el cable adentro del doblez (Imagen8).

9. Afegir cintes que peguen tots els trozos d'alumini (Imagen9).

10. Ajustar recortes amb una regla (Imagen10).

11. Assegurar amb més cintes horitzontals els trozos (Imagen11).

12. El total de les cintes pegades horitzontalment va ser de: 3 (Imagen12).

13. Pegar plantilla de les tecles al cartró (de mínim 18cmx26cm) i reforçar els llats (Imagen13).

14. Lo pots decorar com desees (Imagen14).

Nota: Les imatges estan ubicades a la part de dalt a l’ordre dels passos. Aquí trobareu més informació sobre els Capacitive Touch Sensor Pins, i la manera d’unir-ho a l’alumini

Pas 8: Instrumento Musical Multimèdia Terminat

En la part inferior podrem trobar l’apk del projecte per a què es pugui descarregar en el cel·lular i d’aquesta manera probar l’aplicació.