Acho que as dicas que eu daria, seria criar um Xmind para organizar seus pensamentos e fluxos de trabalhos, criando sessões no Xmind como Layout, Lógica, Ideias etc, assim você consegue puxar ganchos e organizar o que está fazendo, se o seu layout for para qualquer dispositivo lembre de se amigavel com mobile, use imagens em formatos como webp pois são atual e o mais leve para carregar, pense bem em UX design, mantenha as coisas organizadas, mantenha o código organizado, resposnabilidades únicas, documente as funções, organize o css, sempre dê o feedback do que está acontecendo ao usuário, um input selecionado, um input inválido as vezes essas coisas simples vai te custar alguns dias de trabalho, mas seu eu do futuro agradecerá.

Tudo o que falei acaba sendo um pouco genérico, mas acho que é válido, pois como você disse que pretende expandir o projeto, é bom já começar organizado, não vá empilhando bagunça, se for o caso desenvolva um pouco, pense no futuro, dê alguns passos atrás, refatore e prepare seu código para receber o futuro upgrade, nessa situação com html css e js puro, eu faria orientado a objeto, cada classe responsável pelo seu setor, classe menu, manipula os menus, classe audio manipula o audio, etc, com os métodos get e set para se for o caso poderem ser usados dentro de outra classe, porém se algo der pau, você vai saber qual a classe responsável daquilo e vai mexer só naquilo, não sei como isso seria em react, mas daria o tratamento equivalente