Table des matières:
- Fournitures
- Étape 1: Creando Código En Arduino IDE
- Étape 2: Creando Proyecto En App Inventor
- Étape 3: Creando La Interfaz De Usuario De La Aplicación
- Étape 4: Importando Imagenes En App Inventor
- Étape 5: Importando Sonidos En App Inventor
- Étape 6: Creando El Código En App Inventor
- Étape 7: Desarrollando El Piano Con Cartón, Papel Y Aluminio
- Étape 8: Terminado Instrumento Musical Multimédia
Vidéo: DoReMi : 8 étapes
2024 Auteur: John Day | [email protected]. Dernière modifié: 2024-01-30 09:06
Si quieres crear este instrumento musical multimédia "DoReMi" puedes seguir este paso a paso:
Fournitures
Estos son los materiales que vas a necesitar:
1. Cellulaire
2. Wemos Lolin32 (Cantidad:1)
3. Protoboard (Cantidad:1)
4. Cables para conexión (Dupont tipo Macho-Macho ó de cobre) (Cantidad: 7)
5. Pape
6. Carton
7. Aluminium
8. Tijeras
9. Regla
Étape 1: Creando Código En Arduino IDE
El primer paso será conectar cables dupont en los pines táctiles del Lolin32 como se muestra en las dos imágenes de arriba.
- Pin tactile en GPIO 4
- Pin tactile en GPIO 2
- Pin tactile en GPIO 15
- Pin tactile en GPIO 14
- Pin tactile en GPIO 27
- Pin tactile en GPIO 32
- Pin tactile en GPIO 33
Luego deberás realizar el código "Bluetooth" en el logiciel Arduino IDE, qu'aparecerá en la parte inférieur.
Étape 2: Creando Proyecto En App Inventor
Primero deberás dirigirte al siguiente link para ouvrir l'inventeur de l'application: inventeur de l'application
Luego en la parte de arriba a la izquierda dar click en Create Apps e ingresar tu correo electrónico para iniciar session.
Para crear un nuevo proyecto dar click en: Start new project y después añadir 1 screen dando click en: add Screen.
Étape 3: Creando La Interfaz De Usuario De La Aplicación
Para diseñar la interfaz de usuario:
Primero deberás poner de manera horizontal la pantalla, esto se hace dando click in the parte derecha donde dice: Screen1 y en donde dice ScreenOrientation cambiar la opción por Landscape.
Luego buscar en Pallete(ubicada en la parte izquierda):
En Layout: la opción que diga HorizontalArrangement y arrastrarla a la interfaz
En Interface utilisateur: ListPicker (que es para que en la aplicación se muestre une liste d'éléments y el usuario pueda elegir) y en Properties, situada en la parte derecha, poner en Text: Escanear. También Label(que es para mostrar texto) y al igual que con ListPicker poner en Text: Estado:Conectado. Estos dos componentes deberás arrastrarlos al HorizontalArrangement
- En capteur: Horloge y deslizar a la interfaz.
- En connectivité: BluetoothClient y arrastrar a la interfaz.
Si desseas observar como debería quedar, en la parte superior se encuentra una imagen de la interfaz de usuario terminada.
Étape 4: Importando Imagenes En App Inventor
Para importar las imágenes que se encuentran en la parte de arriba deberás dirigirte a Media, ubicada a la derecha debajo de Components, y seleccionar: upload file y choose file.
Después deberás ir a Pallete (ubicado en la parte izquierda) y en User interface arrastrar a la interfaz la opción que diga Image, después en Properties(en la parte derecha) buscar Picture y en esta aparecerán las imagenes que añadiste anteriormente.
Nota: Para acomodar las imágenes en el centro, en Properties cambiar en Width y Height por: Fill parent. Todas las imágenes (menos la del inicio) deben desactivarse, para esto en Properties se debe desactivar la opción Visible (que no esté azul).
- Imagen de inicio (En AppInventor: Image1)
- Imagen Do (En AppInventor: Image2)
- Imagen Fa (En AppInventor: Image5)
- Imagen La (En AppInventor: Image7)
- Imagen Mi (En AppInventor: Image4)
- Imagen Re (En AppInventor: Image3)
- Imagen Si (En AppInventor: Image8)
- Imagen Sol (En AppInventor: Image6)
Étape 5: Importando Sonidos En App Inventor
Para importar los sonidos que están en la parte de abajo deberás dirigirte a Media, ubicada a la derecha debajo de Components, y seleccionar: upload file y choose file.
Después deberás ir a Pallete (ubicado en la parte izquierda) y en Media arrastrar a la interfaz la opción que diga Sound, después en Properties(en la parte derecha) buscar Source y en esta aparecerán los sonidos que añadiste anteriormente.
- Sonido DO (En AppInventor: Sound1)
- Sonido FA (En AppInventor: Sound4)
- Sonido LA (En AppInventor: Sound6)
- Sonido MI (En AppInventor: Sound3)
- Sonido RE (En AppInventor: Sound2)
- Sonido SI (En AppInventor: Sound7)
- Sonido SOL (En AppInventor: Sound5)
Étape 6: Creando El Código En App Inventor
Primero dar click en Blocks, ubicado en la parte superior a la derecha al lado de Designer, para poder realizar la programación de los componentes.
Después en Blocks(ubicado en la parte izquierda) podrás arrastrar los bloques que necesites.
1. En esta parte se actualiza el listado de los bluetooth disponibles pour que cuando se le de click al botón aparezcan todos los listados (Imagen1).
2. Acá se conecta al bluetooth seleccionado et se cambia el texto de la app de "Desconectado" a "Conectado" (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. Con este se activa la imagen y el sonido de la nota "DO" y desaparecen las demás imagenes (Imagen4).
5. Con este se activa la imagen y el sonido de la nota "RE" y desaparecen las demás imagenes (Imagen5).
6. Con este se activa la imagen y el sonido de la nota "MI" y desaparecen las demás imagenes (Imagen6).
7. Con este se activa la imagen y el sonido de la nota "FA" y desaparecen las demás imagenes (Imagen7).
8. Con este se activa la imagen y el sonido de la nota "SOL" y desaparecen las demás imagenes (Imagen8).
9. Con este se activa la imagen y el sonido de la nota "LA" y desaparecen las demás imagenes (Imagen9).
10. Con este se activa la imagen y el sonido de la nota "SI" y desaparecen las demás imagenes (Imagen10).
Étape 7: Desarrollando El Piano Con Cartón, Papel Y Aluminio
Para desarrollar este instrumento musical multimédia puedes utilizar las plantillas que están en la parte inferieur, y la última imagen llamada "Guía".
1. Intentar que los cables queden como se muestra en la Imagen1.
2. Realizar agujero en la plantilla, en los cuadrados negros (Imagen2).
3. Ingresar los cables por estos huecos (Imagen3).
4. Asegurar la plantilla en el cartón, al igual que la protoboard (Imagen4).
5. Reforzar la parte de atrás (Imagen5).
6. Recortar 7 trozos de aluminio: 6cmx6cm (Imagen6).
7. Doblar el aluminio previamente recortado a la mitad (Imagen7).
8. Pegar cuidadosamente, colocando el cable adentro del doblez (Imagen8).
9. Añadir cintas que peguen todos los trozos de aluminio (Imagen9).
10. Ajustar recortes con una regla (Imagen10).
11. Asegurar con más cintas horizontales los trozos (Imagen11).
12. El total de las cintas pegadas horizontalmente fue de: 3 (Imagen12).
13. Pegar plantilla de las teclas en el cartón (de minimo 18cmx26cm) y reforzar los lados (Imagen13).
14. Lo puedes decorar como desees (Imagen14).
Remarque: Las imágenes están ubicadas en la parte de arriba en el orden de los pasos. Aquí encontrarás más información sobre los Capacitive Touch Sensor Pins, y la manera de unirlo al aluminio
Étape 8: Terminado Instrumento Musical Multimédia
En la parte inférieur podrás encontrar el apk del proyecto para que lo puedas descargar en el celular y de esta manera probar la aplicación.
Conseillé:
Comment fabriquer une antenne double biquade 4G LTE en quelques étapes faciles : 3 étapes
Comment créer une antenne double biquade 4G LTE Étapes faciles : La plupart du temps, je n'ai pas une bonne force de signal pour mes travaux quotidiens. Donc. Je recherche et essaye différents types d'antenne mais ne fonctionne pas. Après une perte de temps, j'ai trouvé une antenne que j'espère fabriquer et tester, car ce n'est pas un principe de construction
Game Design dans Flick en 5 étapes : 5 étapes
Game Design dans Flick en 5 étapes : Flick est un moyen très simple de créer un jeu, en particulier quelque chose comme un puzzle, un roman visuel ou un jeu d'aventure
Système d'alerte de stationnement en marche arrière Arduino - Étapes par étape : 4 étapes
Système d'alerte de stationnement en marche arrière Arduino | Étapes par étape : dans ce projet, je vais concevoir un circuit de capteur de stationnement inversé pour voiture Arduino simple à l'aide d'un capteur à ultrasons Arduino UNO et HC-SR04. Ce système d'alerte de marche arrière basé sur Arduino peut être utilisé pour une navigation autonome, une télémétrie de robot et d'autres r
Détection de visage sur Raspberry Pi 4B en 3 étapes : 3 étapes
Détection de visage sur Raspberry Pi 4B en 3 étapes : dans ce Instructable, nous allons effectuer une détection de visage sur Raspberry Pi 4 avec Shunya O/S en utilisant la bibliothèque Shunyaface. Shunyaface est une bibliothèque de reconnaissance/détection de visage. Le projet vise à atteindre la vitesse de détection et de reconnaissance la plus rapide avec
Miroir de vanité de bricolage en étapes faciles (à l'aide de bandes lumineuses à LED): 4 étapes
Miroir de vanité DIY en étapes faciles (à l'aide de bandes lumineuses à LED) : Dans cet article, j'ai fabriqué un miroir de vanité DIY à l'aide des bandes LED. C'est vraiment cool et vous devez les essayer aussi