PDA

View Full Version : Web-Based Voice Recording Options



jamestl2
04-02-2010, 10:22 PM
Hey guys,

A few months ago I had decided I wanted to create an audio-recording solution for an internship website that I had been working on for the past year. We had eventually switched the Site CMS over to Wordpress MU, and as far as I know, that's what it's still based on. After hours of additional searching for a specific solution, my internship professor had finally settled on the Riffly recording plugin (http://riffly.com/) recommendation, after heavily considering Javasonics (http://www.javasonics.com/). However these weren't quite the best solutions available, as he wanted the recordings to be better managed and self-hosted.

Basically we wanted a recording plugin that would allow users to leave recorded messages inside the comment template (As a comment, mostly). Also, the internship concluded once I graduated from college this past December, so this isn't something that I'm being required to do or has a deadline at the moment.


OK, all the boring history aside, here's my dilemma. I decided I wanted to create a WP plugin from scratch. The PHP and Database Interaction isn't likely going to be a problem for me, I can handle that aspect just fine. It's the client-side interaction that's going to give me the problems.

I've searched the web and apparently it's possible to create something like this in Flash or Java. I however, A) Have no experience with either of the languages and B) Don't have the resources to spend $700+ on an Adobe product that I'll likely only use once ever for this situation.

Would something like this be possible with a Javascript library? Does anyone else have experience developing an audio recording interface in Flash or Java? Or did anyone happen to find any easy-to-use existing client-side applications that are very flexible with server-side integrations? I'm trying to figure the best way to either integrate an existing one, or find the best language to make something like this myself, so it'd be entirely from scratch.

Anyway, this isn't Urgent-NEED-To-Know-Now, but I know it's something I'd like to develop in the future.

Patrysha
04-02-2010, 10:27 PM
No clue at all, but you can use Adobe products free for 30 days...so you could download and do the project and have it wrapped up before the trial is over.

jamestl2
04-02-2010, 10:33 PM
That is something I thought about Patrysha, however though I don't know if 30 days is a reasonable amount of time for me to learn Flash in AND develop the application too.

Patrysha
04-02-2010, 10:45 PM
No idea. I haven't learned enough about Flash to know how long it would take.

I did a download for InDesign...was able to manage navigating that well enough within a day to create the brochure I wanted to try it out on.

vangogh
04-03-2010, 01:40 AM
James I had no idea if this could be done, but I was interested so I did some quick searching. Seems like most are agreeing with you that this is either a Flash or Java thing. However I found two options that don't require either, though neither is going to be a perfect option.

I found this thread on Stack Overflow (http://stackoverflow.com/questions/64010/how-does-one-record-audio-from-a-javascript-based-webapp) which is mostly recommending Flash and Java, but also points to the JetPack API at Mozilla (https://wiki.mozilla.org/Labs/Jetpack/JEP/18). With JetPack you can build an extension that will do what you want and you'd basically code it with html, css, and javascript. However your visitors would need to have a Mozilla based browser and install the extension.

Here's a different link to the JetPack SDK (https://jetpack.mozillalabs.com/)

The other option is more interesting to me and will eventually be your solution. It looks like you'll be able to do this with HTML 5 (in combination with javascript). Here's a post I found, Beyond HTML5 - Audio Capture in Web Browsers (https://labs.ericsson.com/blog/beyond-html5-audio-capture-web-browsers).

The W3C is working on the spec for device element (http://dev.w3.org/html5/html-device/), which will let you hook into the visitors computer if they allow it. From the spec:


The device element represents a device selector, to allow the user to give the page access to a device, for example a video camera.

Of course the spec also says:


Implementors should be aware that this specification is not stable. Implementors who are not taking part in the discussions are likely to find the specification changing out from under them in incompatible ways.

So it's hardly ready yet. However know it's coming. You can also look for Flash alternatives. There are other programs (some free I think) that can do some of what Flash can do. I'm not sure if that includes recording audio, but it's something else to look into.

jamestl2
04-03-2010, 03:08 AM
Thanks for checking into it, Steve. It's definitely interesting for me too. My professor then was surprised that there hadn't been many applications developed for purely web-based audio solutions, given all the potential it can offer.

The site I had been developing for the internship was for foreign language instruction, and using audio could be a great way to compare vocabulary, pronunciation, etc. for testing students and advising them.


Anyway, with the first option, yeah, it seems the audience is pretty limited. (They'd have to be using FF and have to install the appropriate add-on.) Don't know how many people would find such a plugin universally useful.

That HTML5 document is interesting. With HTML5 however, not reaching W3C recommendation until 2022 seems like a long ways away (even if certain parts, like the device element perhaps, may be ready to go beforehand). But there's no telling which ones will be ready and when exactly they'll be released with widespread support.

The way I saw myself developing the plugin would follow along these lines of usability:

A visitor with a microphone plugged into their computer visits the said site,
They'll first use an applet of some sort to create the audio messages,
then save (or re-record) those recordings as mp3 or wav files (or whatever format),
and finally save those new files into the DB
or directly into a specific server directory
and play them back after making a recording.


I'll make a choice between 4 and 5, but haven't decided which way would be better, and at the moment it isn't a big deal. Either way, the recorded comments visitors or members make would be saved as an mp3-like file for future reference. The functionality is already similar to the existing solutions, it's just what's being done with the files that's different.

One more direction I had considered was modeling the plugin after a WP Podcast Recorder, but those are Java and Flash based too, I'm fairly sure.

I had also searched for just a few simple audio recorders (like what audacity does), but since a majority of those aren't web-based, it can be tough communicating with the server, especially when I don't have much experience with the programming language used to develop them (C++, I believe is the common one), and just how exactly I would adapt those existing recorders into a web-based environment could prove to be an even bigger challenge.

vangogh
04-04-2010, 12:26 PM
With HTML5 however, not reaching W3C recommendation until 2022

This is going to be more about browser adoption than worrying about when the standard is recommended. Right now other than IE, most browsers can handle html5. Not necessarily all of it, but if all the browsers adopt the audio spec there's no reason why you couldn't use it.

At the moment though you may have to use Flash or Java or C++.

billbenson
04-04-2010, 01:01 PM
There is F4L (Flash for Linux) if you want to go that route. Don't know how well it works though.

jamestl2
04-04-2010, 07:01 PM
I take it that Flash and Java Applets are my only real choices for the time being then? Just trying to decide if getting involved with either program from the ground up would be worth it at this point in time, being only for one aspect of one application.

Anyone have personal experience dealing with these forms of development? If yes, have they came easy for you?

Harold Mansfield
04-05-2010, 02:47 AM
I take it that Flash and Java Applets are my only real choices for the time being then? Just trying to decide if getting involved with either program from the ground up would be worth it at this point in time, being only for one aspect of one application.

Anyone have personal experience dealing with these forms of development? If yes, have they came easy for you?

I had a brief stint with Flash last month. I did what Patricia said and used CS4 for free for 30 days to edit a video player on a clients site.

Personally,I wasn't that thrilled with it. Mostly because I had no idea what I was doing, everything was hit and miss and I was on the clock. Not exactly the ideal learning enviroment.

If you have time to learn it is probably a different experience and the 30 day trial that Adobe offers may be enough to do what you need to do.

I can honestly say, I would like to own the software, I just haven't had the nerve to drop $700 on a download yet, although it is very robust and probably the best on the market.

vangogh
04-05-2010, 10:44 AM
I know or used to know a little Java. It wasn't too hard to pick up the basics. I never needed it beyond that so never got that deep into it and never did anything specifically with applets. If you know how to program I would think Java relatively easy for you to learn.

I also don't have a ton of experience with Flash. From what I remember the program can take awhile to learn. The interface was familiar enough since I use other Adobe products like Photoshop, but Flash never worked the way I expected it to. That's mainly for the animation. The programming aspect of Flash is called Action Script and it's similar to JavaScript or at least seemed to be. Again as a programmer you shouldn't have too much difficulty working with Action Script, though it may take some time getting used to work with Flash in general.

jamestl2
04-05-2010, 08:32 PM
Those are pretty much my thoughts on the subject too, Harold. I don't want to spend $700 on something that I barely understand the mechanics of. And I feel that 30 days puts too much pressure on making enough time to learn the basics of flash, understand the CS4 interface, adapt and implement the programming syntax of Actionscript, and actually develop the flash aspects of the plugin. (Especially when you have other things you're working on too.)



I know or used to know a little Java. It wasn't too hard to pick up the basics. I never needed it beyond that so never got that deep into it and never did anything specifically with applets.


What did you use Java for, Steve?

Although I don't really know much about Java (other than it's a programming language, uses OOP, and that it's mostly based off of C and C++), I do believe the JDK is free to download, so it may be a good place to start.

And if it's at all simpler than C++ (or even PHP), I don't think that it'll be too difficult to pick up the basics of the syntax and functionality.

vangogh
04-06-2010, 10:56 AM
The only time I ever used Java was in some continuing education courses I took a few years ago. Can't say I've ever used it in a practical application. Just remember it wasn't too difficult to learn the syntax.

jamestl2
04-06-2010, 02:53 PM
Alright, cool.

Just started downloading the JDK. I'll test some things out, see how the program works for me, etc.