Work song
posted by max on August 12, 2008 at 05:20:35 PM
Hello my pretties. It's been a busy few weeks for me, learning Flash and Actionscript has been fairly miserable, but I am chugging along and am ready to give you all a preview of the new YTMND template.
Take a peek at the future after the "break".
Please note this is in its early stages, and the UI and a good portion of the functionality will change, so this would be a good point in time to provide feedback and "constructive" criticism.
I am sure some of you are confused about a lot of the features, so I will go over each briefly, the layout is really up in the air and I am a terrible designer but keep in mind, some of these features are aimed both at seasoned YTMND users and the average passer-by.
For those of you who haven't been paying attention, in addition to the above buttons, this player adds some other major improvements:
There are still some big concerns for me, which I have yet to research heavily. One of the biggest, is the inability to control your browser while in a Flash app. This means opening new tabs, refreshing, bookmarking, etc. is all broken without using browser menus in some browsers. This probably won't be fixed soon outside of hacks (it's been a "critical" bug in Firefox since 2001.).
There's still a pretty big TODO list for the template, but it is getting there, despite my ever growing hatred for Flash. I think at launch I am going to move the old template rather than replace it, so users will still be able to view YTMNDs in the original template for those of you that fear the various pages and fads that take advantage of the current UI placements.
Anyway, I really need your feedback, design ideas, what you think is important here. Outside of a few very helpful people this has been a fairly lonely project. Also, for those of you who actually know humans in real life and use "social networking", I finally got around to making a YTMND "Facebook page" where you can all gather and do whatever it is people do on "social networking" sites. If any of you want to be an admin and take over organizing it, send me a private message here on YTMND.
Take a peek at the future after the "break".
Please note this is in its early stages, and the UI and a good portion of the functionality will change, so this would be a good point in time to provide feedback and "constructive" criticism.
I am sure some of you are confused about a lot of the features, so I will go over each briefly, the layout is really up in the air and I am a terrible designer but keep in mind, some of these features are aimed both at seasoned YTMND users and the average passer-by.
| The YTMND logo will function as a "smart" back button. When a user visits a YTMND from off-site, this button will link back to www.ytmnd.com, when a user visits a YTMND from somewhere on YTMND (e.g. search results, a user's profile, the digest, etc,) clicking the logo will take you back to the page you were previously viewing. |
| The question mark makes its return as the button which opens up the "info box", which I might add is currently devoid of organization or design, so don't get too concerned about it yet |
| The comments button will give you a direct link to the site's profile/comments section for quick access. |
| This button allows the user to do a forced-resynchronization of the sound and image when needed. It is currently a bit finicky, so it stops both sound and image, and then 1 second later starts them from the beginning. The final version will display a status indicator and the restart button will be disabled during the restart phase. |
| This button allows you to take advantage of Flash's true full-screen mode, which takes up 100% of the screen real estate and also provides hardware accelerated rendering. Hopefully this will mean the end of GIF synch issues. |
 | The sound control is like any other "movie player"; click toggles muting, mouse-over brings up a volume slider for finite control.
For those of you who haven't been paying attention, in addition to the above buttons, this player adds some other major improvements:
- True gapless playback for both WAV and MP3 files, no more Quicktime, no more broken sound, no more compatibility issues.
- Asynchronous asset loading, images and sound files are loaded at the same time.
- No more browser-specific issues, flash works pretty much the same in every browser. Maybe we can get rid of (refresh) for real now.
- Better image placement: at launch the template will allow you to tile, or give a specific area to place the image (e.g. top left, top middle, top right, etc.)
There are still some big concerns for me, which I have yet to research heavily. One of the biggest, is the inability to control your browser while in a Flash app. This means opening new tabs, refreshing, bookmarking, etc. is all broken without using browser menus in some browsers. This probably won't be fixed soon outside of hacks (it's been a "critical" bug in Firefox since 2001.).
There's still a pretty big TODO list for the template, but it is getting there, despite my ever growing hatred for Flash. I think at launch I am going to move the old template rather than replace it, so users will still be able to view YTMNDs in the original template for those of you that fear the various pages and fads that take advantage of the current UI placements.
Anyway, I really need your feedback, design ideas, what you think is important here. Outside of a few very helpful people this has been a fairly lonely project. Also, for those of you who actually know humans in real life and use "social networking", I finally got around to making a YTMND "Facebook page" where you can all gather and do whatever it is people do on "social networking" sites. If any of you want to be an admin and take over organizing it, send me a private message here on YTMND.
Add a comment
holy f*ck max i don't want this to turn into a big cereal box. Like the front page is the front of the box, and that while the ytmnd is loading, the cereal box opens and you dive down into it and it gets dark then the ytmnd loads wtf screw ytmnd ill make my own cereal box with blackjack dealers, and hookers, in fact, forget the cereal box and the blackjack dealers.
Part of this project was an element that converts animated GIFs into Flash movies (as Flash won't load animated GIFs in at run-time), it required me to spend a lot of time looking at the GIF specifications. I was surprised at the finite level of control and rich feature-set GIF provided far ahead of its time. I have new-found respect for the format.
I dun did my research on gifs too, and had a brief twinge of respect for how ahead of its time the format was, except that it was 1988 er sumthin when this marvel of motion graphics was devised. I make consistent-speed looping .mov files at twice the resolution, thrice the fps, unlimited colors, infinitely better image quality and 1/3 the filesize of a gif. And it's a far simpler setup than tweaking with gif parameters.
It isn't an initial goal, but it hasn't been scrapped. Basically the first draft will load up an XML file with all the site information including asset URLs. Once I learn more it may be easy to turn the player into an AIR desktop application that can read .ytmnd files which just contain the same thing as the XML file, but with local copies of the assets.
I'll bet 90% of the songs I have in my playlist have come from what I found on YTMND. One night I was bored and I numbered my songs from favorite to least favorite. Believe it or not, Alpha Beta Gaga is at the top at #1, closely followed by St. Elmo's Fire (Man in Motion) - John Parr. YTMND caused me to like music a lot more than I used to. Before, all I ever listened to was Queen and Native American flute music.
Me too actually. My music tastes have remained similar, but YTMND has exposed me to a greater variety of artists and music. I have all of the soundtracks and enjoy them very much. It's funny when you're working on something and your iPod which is on shuffle starts playing the Riverside song or the NEDM theme.
I've spent a while on this. My current solution is a server-side compiler that creates AV1Movies which are quite a hassle to work with and as of yet I don't know how to tile them. I spent a good deal of time trying various methods of loading animated GIFs in at run-time, including the method you describe. There is a chunk of code on code.google.com called AS3Gif which allows you to decompile/compile animated GIFs into bytearrays.
The GIF-to-SWF decompile/compile works fairly well on dinky animations with small frame counts and complexity. When you try to feed it a 2-3mB GIF it ends up using 100% CPU for a good 15 seconds. That is obviously unacceptable especially when every single time a GIF is viewed it needs to be compiled by the user. The ideal method would be to use some server-side Flex app that pre-compiles an animated GIF into a bytearray.
In all honesty though, I only learned what a bytearray was in the last two months so this is all fairly new territory for me. I'm not even sure how if it is possible to save a run-time compiled bytearray server-side, and if it is I have no idea how to do it. It would be great if I could manage to do gapless WAVs and animated GIFs server side with Flex rather than the current proprietary software I am using that creates AVM1Movies.
For the server compiled AVM1Movies I have to hack code into them to open a LocalConnection so that the main player can control them, and that control is currently limited to play and stop. If I were using Flex or some other alternative made in the last year I wouldn't have to deal with the backwards compatibility problems. Long story short, animated GIF and gapless WAV on a large scale is a fairly difficult technical hurdle.
Upon further investigation, it seems like a simple feat to save a compiled bytearray to a remote server using AMFPHP or the like, but I'm not sure if I can do it at compile-time. I could write a script that has some sort of headless/dummy flash player hit the SWF to fire the save event off, but it seems hacky at best. I will spend some more time researching it.
Another possibility is to force users to upload through a Flash "uploader widget" which would save the file to the server and then if necessary, convert it to a ByteArray and save it to the server. There are two issues I see with this option, first is security. I'm sure someone would figure out how to inject malicious code into a ByteArray and get it saved on the server. Another issue is that it wouldn't be able to convert the millions of assets that we already have.
I like the improvements in terms of syncing and Quicktime playback issues, but I think the user interface could use a little clean up. Maybe you should put the Reload/Fullscreen/Volume controls inside the info box (there's plenty of room across the top). Also, the question mark just hanging there next to the YTMND logo seems a bit out of place. Maybe that could be rearranged some how to make it look better.
Overall though, it looks like a great improvement.
Absolutely fantastic, max. Just make sure that the buttons/description window aren't too big or in the way. Also, it would be cool if each user could customize how their pages look (for example, only show the ? button and the fullscreen button instead of all of them, or just not show the volume button). And when I clicked on the ? button I couldn't type in the comment box for whatever reason until I clicked on it again. But yeah, customization potential is huge (unless I really have no idea how flash works)
I've been playing around with the gif - > avi conversion.
Honestly, doing the convertion in flash at run time is a bit odd. Sure, you don't risk any type of overrun/injection attacks, but it seems like a painful way to go about it. This also keeps all the old content in a legacy format wasting a ton of space.
So far, I'm having some issues with frames. Even if you do come up with an action hack... a server side component will still be handy to convert content to a uniform and compact content.