https://github.com/ninja1375/caixa-de-som-animada

https://github.com/ninja1375/caixa-de-som-animada

Last synced: about 1 month ago
JSON representation

• Host: GitHub
• URL: https://github.com/ninja1375/caixa-de-som-animada
• Owner: Ninja1375
• Created: 2024-10-20T22:18:03.000Z (7 months ago)
• Default Branch: main
• Last Pushed: 2024-11-04T17:31:38.000Z (7 months ago)
• Last Synced: 2024-12-14T20:15:44.874Z (6 months ago)
• Language: CSS
• Homepage: https://ninja1375.github.io/Caixa-de-Som-Animada/
• Size: 22.5 KB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
**Veja o projeto ao vivo:**

**[Caixa de Som Animada](https://ninja1375.github.io/Caixa-de-Som-Animada/)**

Este projeto simula uma caixa de som com alto-falantes e uma corneta realistas, que reagem ao tocar de um arquivo de áudio carregado pelo usuário. A caixa de som é estilizada com uma cor chocolate, e os alto-falantes possuem animações de pulsação que se ativam conforme a música é reproduzida. Além disso, há uma corneta posicionada acima dos alto-falantes, que também se anima junto com eles.

A interface inclui um input oculto para seleção de arquivos de áudio, que é substituído por um ícone, tornando o design mais elegante. O nome da música selecionada é exibido, e há um controle de volume para que o usuário possa ajustar o som durante a reprodução.

## Funcionalidades: ##

**1 - Caixa de som com visual realista:**

A caixa de som é composta por quatro alto-falantes dispostos em duas colunas, com um design tridimensional, que simula profundidade e realismo.

Uma corneta posicionada centralmente acima da primeira linha de alto-falantes, também com um efeito realista, simulando uma corneta de som verdadeira.

**2 - Animação sincronizada com a música:**

Os alto-falantes e a corneta ficam animados (pulsando) apenas quando a música está tocando.

A animação para automaticamente quando a música é pausada e reinicia ao continuar a reprodução.

**3 - Carregamento de arquivos de áudio:**

O usuário pode selecionar um arquivo de áudio diretamente do seu dispositivo através de um input do tipo file oculto, que é substituído por um ícone.

Após a seleção, o nome do arquivo de áudio é exibido abaixo do ícone, permitindo que o usuário veja a música escolhida.

**4 - Controle de volume:**

Um controle deslizante de volume (input range) é adicionado para que o usuário possa ajustar o volume da música durante a reprodução.

**5 - Design intuitivo e responsivo:**

A interface é simples e amigável, permitindo que o usuário interaja facilmente com a caixa de som, carregue suas músicas e controle a reprodução de forma intuitiva.

O layout é centralizado e ajustável, funcionando tanto em dispositivos móveis quanto em desktop.

## Benefícios: ##

Criação de uma interface visual interativa que combina design estético com funcionalidade de áudio.

Animações realistas que tornam a experiência de tocar música mais envolvente.

Permite uma experiência personalizada ao tocar arquivos de áudio diretamente do dispositivo do usuário.

## Melhorias Futuras: ##

Adicionar suporte para listas de reprodução.

Implementar efeitos sonoros adicionais, como eco ou equalizadores visuais.

Melhorar o design dos controles de áudio com botões mais personalizados e efeitos visuais.

## linguagens Utilizadas ##

  

## Apoie-me: