17 ms·
Show HN: Hyperlax.tv – a real-time feed of Instagram's latest Hyperlapse videos
- Kiro 11y agoWhy was the title changed? It's not about the Instagram videos only. That would be a useless service. It's about the whole concept, which the old title much better represented.
- tbird24 11y agoHuh. Disappointed they changed it, would have thought I have the right to describe my own site! Oh well.
- siegecraft 11y agoThis is really amazing, thank you for sharing.
- t-mw 11y agoGood job! I think it would suit being played on a big screen at events/cafés. Will new videos be played as they're posted, or will it continue moving back in history? Edit: Answered my own question I think, it just returned to play a video from a few minutes ago.
- tbird24 11y agoReally excited to share a personal project I've been working on here. If you check it out, I'd love to know what you think. Enjoy a peek into the lives of others, from locations around the world. Hyperlax is meant to be a bit of an escape, a bit voyueristic, a bit relaxing. I think it's mesmerising. Maybe you will too!
- Zekio 11y agoLike it! Though personally i would probably not have used A tag in the navigation, so you don't get the Dashed outline if you click them, since its not a new page that loads, but otherwise I really like it. Bookmarked :) EDIT: actually the A tags could just get the css rule (Outline: none;)
- 10dpd 11y agoPlease don't use outline:none unless you are prepared to create your own custom outline.
- tbird24 11y agothanks for the feedback! Weird, I don't get the outline myself. I believe I did use outline:none; but I'll double check. What browser are you using?
- Zekio 11y agoIt could be my browser, since i am using Firefox developer edition 40.0a2 Edit: btw, thanks for sharing site, its awesome watching people race down the highway and changing lanes in hyperlapse to relaxing music :)
- braaap 11y agoI was transfixed. Really, really good. The music really makes it for me. It is interesting to try and guess where the mystery locations really are. Sometimes this information is included in the hashtags. I got a few right! :)
- tbird24 11y agoThank you so much for checking it out :)
- shoq 11y agoIn the description meta tags you wrote peak instead of peek. Sometimes if a lot of short clips are played successively I only see compression artifacts. Very nice idea and implementation though!
- venantius 11y agoThis is a super cool project! Totally the sort of thing I would leave open in a window while I worked.
- lostbit 11y agoNice! I will set it on my room TV as an ambient attaction while talking with friends. let's see how it goes. This reminds me that project Hyperlapse.js on http://hyperlapse.tllabs.io/ http://hyperlapse.tllabs.io/. They used to have a working site where you could make your own (quick) hyperlapse using Street View's content.
- tbird24 11y agoSweet! It works great with Chromecast and Apple TV, so have at it :)
- paromi 11y agoa volme control would be nice
- Zekio 11y agoI was thinking that too, since its full volume / mute right now.
- braaap 11y agoInteresting. You still use this feature? I always thought YouTube and the like still included it on their sites as a throwback to an earlier time, or something. I always use the software on the playback device itself to control the speakers.
- marquis 11y agoVolume controls are important! Some examples: you are on a VoIP call but want background music. You have to listen out for some notification and the front music can't be too loud. You work with other audio files e.g video editing but don't need to be listening actively. Any media-multi-tasking situation, really.
- Kiro 11y agoI almost always play several things at once. The standard is to have Twitch or Netflix/HBO on one monitor and a game on the other. Without specific volume controls it would be a disaster.
- 0x0 11y agoPretty cool. Had a tough time getting it to work in Chrome with "right-click-to-play-flash", but finally got it running by whitelisting your domain. Just clicking the "run all plugins this time" didn't work. Edit: The light-bulb icon didn't make much sense at first (fullscreen mode), looks like it's for toggling the sidebar in non-fullscreen-mode only. Maybe hide it in fullscreen?
- tbird24 11y agoflash? There should be no flash on the site, it's an HTML5 video. Very strange..., never heard of this issue before. If you can provide more details that'd be great, but no worries if not. Light bulb actually = "dark mode", it hides everything else on the page. I intentionally left it ambiguous to see if people would curiously click on it :) Thanks for checking it out!
- pki 11y agoi think soundcloud requires flash for "anti piracy purposes", the page doesn't actually show the let's go button until you load flash.
- 0x0 11y agoThe webpage loads at least "http://connect.soundcloud.com/soundmanager2/soundmanager2_flash9.swf" http://connect.soundcloud.com/soundmanager2/soundmanager2_fl... in chrome osx, and it seems that with right-click-to-play-flash this prevents the "let's go" button from appearing, even after clicking "run all plugins this time".
- tbird24 11y agoHhmm, thanks a ton for that info. Not sure yet if there's anything I can do about this, but I will definitely look into it.
- pmontra 11y agoThe audio is flash for me too http://connect.soundcloud.com/soundmanager2/soundmanager2_flash9.swf http://connect.soundcloud.com/soundmanager2/soundmanager2_fl... (Firefox Linux) The funny thing is that the video is mp4 but on Firefox with NoScript it shows the same kind of placeholder as Flash does (when allowing instagram.com but not cdninstagram.com). My first reaction was "wow, Flash?!" And I missed the flash in the audio player.
- janfoeh 11y agoVery nice! A minor niggle: the map in the sidebar doesn't react when the window is being resized. Edit: also, the map seems to get stuck: http://i.imgur.com/YOVzJwz.jpg http://i.imgur.com/YOVzJwz.jpg
- tbird24 11y agoGah! You are correct about the map not resizing. Has to do with the library I used, called Datamaps. I could listen for window resize events, but for the MVP I figured it wasn't worth it. Thanks for pointing it out though, I'll get to this. What did you to do get that map stuck in your screenshot? Never seen that before.
- janfoeh 11y agoI don't think I did anything - I hardly interacted with the page at all, except from skipping a Soundcloud track once and possibly resizing the page. At one point, it switched from "world view" to "US continental view" to show a hyperlapse from Miami, and then got stuck there in perpetuity. Edit — or maybe I had a blackout and this is resize-related as well. It would make sense if I shrank the window, so half of the map got stuck outside the window. Never mind then :)
- LiquidFlux 11y agoThe map doesn't seem to show the icons if I load the site at a 2160p resolution, at a smaller resolution closer to 1080p it renders the icons.
- e12e 11y agoNice project! Was actually hoping for something a little different; I've thought about having 4k streams with (local) ambient audio from around the world for use as virtual "windows". Just hang a 4k tv on a wall, and play a location/timezone that suits your mood... (Perhaps with a 24h buffer, so that one could match relative sun height/light to local time if one wants to...). Would be interesting to see an accompanying technical write-up (choice of technologies, frameworks, rationale -- what was easy, what was hard etc). Nice use-case for soundcloud, btw.
- tbird24 11y agoYou and I are on the same page, I love your idea too. This is my very first project, I'm entirely new to coding, but hopefully eventually I can extend Hyperlax to what you're talking about. Appreciate you checking it out!
- vlad 11y agoNice job! I just created a video review of your project and the one you were inspired by, here. It was a great first project for me to review for the very first episode of my new site. Thanks! http://ratemyapp.com/video/6K_HgG_Xmf8/walkthrough-two-new-apps-play-real-time-hyperlapse-videos-to-music http://ratemyapp.com/video/6K_HgG_Xmf8/walkthrough-two-new-a...
- gvr 11y agoNeat project! Last christmas in SF I wanted to create a "winter vibe" as we were celebrating with the family, and I was looking for videos showing cozy snowfall and winter landscapes. It was surprisingly hard to find something really good. I think it'd be cool if you could select what kind of "window" you want and had a few presets like "Tropical", "Winter landscape", etc. I personally found the mix of soothing slow music and hyper lapse videos to not be relaxing, I think I'd prefer if the videos were running at normal speed or maybe even in slow motion depending on the video.
- fokinsean 11y agoAwesome job! Very impressive for a first project
- techaddict009 11y agoAwesome work. Can you share the tech stack you used?
- tbird24 11y agoHaha, I can but it will leave you unimpressed. This was my very first coding project. It's a front-end app, so good ol' fashioned HTML/CSS/Javascript. Libraries used were: - jquery - Datamaps (for the map) -ElementQueries.js (to do responsive design for a given element, pretty cool, check it out) - Bowser.js (to detect browser) - moment.js (for the "time since") And I think that's it. LMK if you have any other questions.
- DarkTree 11y agowow, very impressive for just "learning" how to code. Great work man, I like the design a lot.
- ashwinaj 11y agoMind blown! Awesome work.
- lsdafjklsd 11y agoThis music is amazing! Is it from one playlist on soundcloud?
- tbird24 11y agoThe default is one playlist, yes. But if you head to the "music" tab, you can choose from a bunch more!
- shostack 11y agoI might be missing it, but is there a link anywhere to the individual playlists on Soundcloud? Would love little links on the music tab to go straight to the playlist vs. just the individual song from clicking the link at the bottom right. The playlist is great but I don't always want the video running to listen to it.
- tbird24 11y agoAh, there isn't, but that's a good idea. Is there a playlist in particular you wanted a link to, I can pull it up for you.
- shostack 11y agoThe chillout one is excellent. Not sure how much revenue opportunity there is, but redesigning that sound player and curating the music with affiliate links might cover some of the hosting bill. Out of curiosity, can you speak to your hosting situation and costs as related to getting hit with this news? I'm a novice coder, but I'm trying to learn about the sysadmin side of things too and wondering how one might take a site like this and avoid massive bills.
- carlbarrdahl 11y agoI was also curious to find the chill out set so I looked in the source of app.js to find the playlist id and fetch the response: `curl http://api.soundcloud.com/playlists/9875415.json?client_id=0e790e28fcdf924f78f80375ad74fcb8` http://api.soundcloud.com/playlists/9875415.json?client_id=0... http://soundcloud.com/chillcall/sets/chill http://soundcloud.com/chillcall/sets/chill
- SwellJoe 11y agoI can't be the only one who pronounced this in my head as "hyper laxative".
- madaxe_again 11y agoYou're not.
- lifeformed 11y agoWhat's supposed to happen? All I see is a big photo of a kid, and a music player that isn't making any sound.
- tbird24 11y agoHhmm. Do you see a big button that says "Let's Go!"? If not, you may have flash blocked/disabled. LMK what browser you're using. Really sorry about that. Promise it's worth it!
- jfoutz 11y agoChrome - had flashblock on, but after enabling flash, still won't go. (hope this helps) this IS supported 2app.js:188 videos and songs not loaded app.js:651 Object {duration: 122208325, release_day: null, permalink_url: "http://soundcloud.com/chillcall/sets/chill", genre: null, permalink: "chill"…} 3app.js:188 videos and songs not loaded app.js:332 [Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object] app.js:452 https://scontent.cdninstagram.com/hphotos-xfa1/t50.2886-16/11682449_1595073700750452_1384791478_n.mp4 app.js:466 hidden video link: https://scontent.cdninstagram.com/hphotos-xaf1/t50.2886-16/11684410_1604272313181065_1563724192_n.mp4 app.js:309 content initialized 2app.js:188 videos and songs not loaded app.js:236 video has been paused! 163app.js:188 videos and songs not loaded
- branchless 11y agoAll the grainy videos with this type of music is reminiscent of a Boards of Canada video. It's cool. edit: to add, just watching the location tab is amazing, really gives an exciting sense of the world buzzing with activity. Plus I just saw where I live and cycle most days!
- sova 11y agoyou nailed it. This is boards of canada!
- shostack 11y agoReally cool. Two suggestions: 1. Widescreen aspect ratios 2. Volume slider, not just control. I'm listening on headphones at my desk at the lowest volume on OSX and it is still too loud. If I try to go any lower the sound turns off.
- tristanho 11y agoFor point 2, try pressing: SHIFT + OPTION + VOLUMEDOWN Definitely agree on the widescreen aspect ratios though, could make a really cool experience even cooler.
- shostack 11y agoThat helped, but definitely would have expected it to just be in the UI and not require an unfamiliar keyboard shortcut.
- tbird24 11y agoRe, #1: I wish, but since these are just Instagram videos, they have to be square. I suppose I could force it to be wide-screen but that would chop off the top and bottom. 2. A few have asked for this, I'll have to build it. It was just an MVP issue frankly.
- Erwin 11y agoSomething similar from Uniqlo (the clothing company!) with interesting Japanese scenes: http://www.uniqlo.com/calendar/ http://www.uniqlo.com/calendar/
- pierrec 11y agoReally mesmerizing! I've actually been watching Hypermasher from time to time since it was also submitted here [1]. I like the improvements that you've made, the interface is certainly nicer, and your codebase appears to be more concise. Hypermasher could run without Flash (barring the music), but Hyperlax refuses to start without it, however that's just a nitpick (though you might be surprised at the number of people who have flash disabled by default these days.) [1]: https://news.ycombinator.com/item?id=8309848 https://news.ycombinator.com/item?id=8309848
- tbird24 11y agoThank you! Regarding the flash issue, you're right, I'm noticing this too. Completely didn't think about that. The "let's go" button waits for the sound to finish loading, but if it never does, you can't start it :/. I'll look into this, hopefully not too many people are affected.
- mortenjorck 11y agoWow, have you patched out Flash dependance already? I'm running on a Flash-free Safari and it looks and sounds great.
- grizzles 11y agoI'm trying to figure out why I like this so much... Nice job.