Dev time: 2 days Project: https://github.com/datyayu/risu.moe Latest commit: 22559ac
So today I officially started working on risu, an interactive peer-to-peer audio player.
I have more ideas to expand this concept, but right now my priority is to get this core functionality working and then I’ll what else can I get in there
Anyway, yesterday I worked on the initial design and came out like this.
The design has 3 main components:
- The chat, which is pretty simple chat box. The idea of this is to use something like firebase to provide real-time and also some commands like !skip or !again to allow the users in the room to vote and interact with the player.
- The playlist, which is just a list of songs added to the queue and that only the room admin will be able to interact with. For the rest of the users, it’s just a preview of the songs to be played.
- The player. More that a player, it’s actually a visualizer. At least on the first iterations, I don’t intend to add controls, as keeping the player in-sync and controlled when dealing with multiple users doesn’t seem to be something easy. Other than that, it’s pretty much and indicator of which song is playing right now, the current progress and who is sharing it.
The songs will be added by dropping files into the browser window. This is something I did on music-visualizer and that I really liked.
You may notice I posted only one design. I’m trying to keep everything as basic as possible while providing a complete experience, so while I do intend to add more pages to deal with things like registration, users and room-managing/showing on next iterations, in this initial version everything will be developed around this single public room.
Of course, this is an initial design and it may change during development.
Today, I translated the design into html/css and some small interaction scripts (see 22559ac). I don’t think there’s much I can say about this. Of course, I did ensure that this works on mobile and desktop, as well as mayor browsers but nothing to extensive as this is a prototype.
And that’s all I did today, I’m now going to start translating this html into elm components and I’ll write more about it once I’m done with that.