5 ms·

Show HN: Tagx.io – Create/share video highlights and annotations

57 points by cxam 7y ago

cxam 7y ago
The idea behind TAGX.io was to make it easier to share highlights of our football (soccer) video recordings. We have been recording and uploading our games to YouTube over the years and almost everyone that played watched it to see how well they/their team performed. It became an additional discussion point days after the game until the next one. However, it does become tedious having to sit through another hour until you find something special you want to share and discuss, usually this is in the form of “check out the goal 23 minutes in”. I built TAGX to ease this process where someone would go through the video, tag the interesting parts and share it with the group. It was almost like a highlight reel, allowing you to skip through the tagged parts. This was my winter holiday side project last year and I figured there would be a wider application of this service (conference talks, tutorials, lengthy videos in general) so I decided to polish it up and make it available as a service for others to use. You don’t need to create any account to use it, it’s all client-side and built using Vue.js. It’s hosted on Cloudflare Workers Sites. I wanted to try out Cloudflare Workers/KV, so I ended up building a link shorting feature including authentication/authorisation flow. You can read more about the stack in support -> technology (https://tagx.io/support/general/technology https://tagx.io/support/general/technology) section. Here is a tagged video of the AWS re:Invent 2019 event which I shared with someone recently that highlighted some announcements that were of interest to us: https://tagx.io/video/id/Nw-wisbyZPu0LCBk9Tzbn https://tagx.io/video/id/Nw-wisbyZPu0LCBk9Tzbn Following are some development stats for those interested: - Client-side: ~80 hours (15th Dec 2019 – 7th Jan 2020) - Server-side: ~30 hours (19th Jan 2019 – 24th Jan 2020) - Node Experience: 5+ years - Vue.js Experience: 2+ years Hope someone finds it useful and any feedback is much appreciated!
- bobosha 7y ago
  You might want to consider building a chrome extension. Users might have problems recalling your site.
  - cxam 7y ago
    Yea, that's always the issue. An extension would be ideal for desktop users and was considering that as a feature, however, for this initial release, I didn't want to alienate any mobile users that may not have the ability to install an extension. Appreciate your feedback and glad someone has the same idea, definitely makes it easier to prioritise features going forward.
    - jbms 7y ago
      With a plugin, people could bookmark/label/index videos themselves within YouTube in a way that is more powerful than what the playlists allow and without needing to resort to browser bookmarks. Being able to distinguish between "my tags" and "public tags" would be necessary.
    - mpfundstein 7y ago
      +1 here. Would be awesome to have this attached to youtube directly.
    - kouh 7y ago
      Mobile users can use firefox extensions
cxam 7y ago
This is the same tagged video I shared in my previous post but without the need for any server-side requests and you can amend yourself: https://tagx.io/video/youtube/7-31KgImGgU/55:52-1:03:30@name:Amazon%20S3%20Access%20Points,1:10:30-1:16:50@name:UltraWarm%20for%20Amazon%20Elasticsearch,1:38:14-1:40:10@name:Amazon%20SageMaker%20Experiments https://tagx.io/video/youtube/7-31KgImGgU/55:52-1:03:30@name...
pensatoio 7y ago
I had this exact same idea in a political context. This could super useful for breakdowns of police footage. Might be wonderful for pro gaming too.
- cxam 7y ago
  These are pretty good use cases, thanks! I hadn't thought of it in a political context, I can definitely see it work there considering the lengthy footage.
pknight 7y ago
Love what this is trying to solve. If the UX could improve, it would be amazing. While watching it would be great to press a button to generate timestamps and to then compose tracks by selecting any two timestamps, with the ability to add tags to timestamps or tracks while the video is still playing or after. This way you could watch a video in one fluent sitting and work out how to organize with the timestamps you created while watching. One usecase is the ability to link to a comedy sketch from a longer clip and send it to a friend with the link just playing between timestamp a and timestamp b.
- cxam 7y ago
  Thanks for the feedback pknight. I'll address the points as follow: (1) While watching it would be great to press a button to generate timestamps This is already possible using hotkeys and documentation for it can be found here: https://tagx.io/support/advanced/hotkeys https://tagx.io/support/advanced/hotkeys (2) then compose tracks by selecting any two timestamps, with the ability to add tags to timestamps or tracks while the video is still playing or after Just to clarify, do you mean the ability to add the current point in time of the video to different tracks? In which case, this is already possible using multiple hotkeys as outlined above. Please let me know if this is not what you meant. (3) with the link just playing between timestamp a and timestamp b You are able to create a loop between a tag or a set of tags, please see loop settings outlined here: https://tagx.io/support/interfaces/video https://tagx.io/support/interfaces/video With regards to autoplay, this is a bit finicky depending on the browser and is usually not recommended due to the negative user experience so I didn't include an option to enable this feature. Hope this is clear, let me know if you have any more questions.
  - pknight 7y ago
    Thanks! It took me a while to digest how that tagging workflow worked with the hotkeys, but now I get it. That does work! I think one of the things that tripped me up was the lack of visual feedback on the second press of a key. Am I right in thinking that the hotkeys don't work while the video is paused? I guess the other thing I'd love to see is a more dedicated 'share' mode so that you can create a link with a simplified screen that starts playing the track section of a video when the user presses play.
j45 7y ago
Sweet project.. Is there any thought or plan to open source this project to contribute?
- cxam 7y ago
  It did cross my mind when I released it. I'd like to refactor the code and bring in more tests to make it "contributor friendly" first. Feedback has been great so far and I'll be implementing some of the features on the back of that. There is a repo (https://github.com/cxam/tagx.io https://github.com/cxam/tagx.io) already that I'm using for issue tracking and I'll be able to push the code there when it's ready.
  - j45 7y ago
    Nice, I came across the repo after I posted. Even if the code isn’t perfect it’s of interest to me because you also used Vue. With respect to tests, maybe the community can contribute. Will keep an eye on the repo..!

57 points by cxam 7y ago

cxam 7y ago

The idea behind TAGX.io was to make it easier to share highlights of our football (soccer) video recordings. We have been recording and uploading our games to YouTube over the years and almost everyone that played watched it to see how well they/their team performed. It became an additional discussion point days after the game until the next one. However, it does become tedious having to sit through another hour until you find something special you want to share and discuss, usually this is in the form of “check out the goal 23 minutes in”. I built TAGX to ease this process where someone would go through the video, tag the interesting parts and share it with the group. It was almost like a highlight reel, allowing you to skip through the tagged parts. This was my winter holiday side project last year and I figured there would be a wider application of this service (conference talks, tutorials, lengthy videos in general) so I decided to polish it up and make it available as a service for others to use. You don’t need to create any account to use it, it’s all client-side and built using Vue.js. It’s hosted on Cloudflare Workers Sites. I wanted to try out Cloudflare Workers/KV, so I ended up building a link shorting feature including authentication/authorisation flow. You can read more about the stack in support -> technology (https://tagx.io/support/general/technology https://tagx.io/support/general/technology) section. Here is a tagged video of the AWS re:Invent 2019 event which I shared with someone recently that highlighted some announcements that were of interest to us: https://tagx.io/video/id/Nw-wisbyZPu0LCBk9Tzbn https://tagx.io/video/id/Nw-wisbyZPu0LCBk9Tzbn Following are some development stats for those interested: - Client-side: ~80 hours (15th Dec 2019 – 7th Jan 2020) - Server-side: ~30 hours (19th Jan 2019 – 24th Jan 2020) - Node Experience: 5+ years - Vue.js Experience: 2+ years Hope someone finds it useful and any feedback is much appreciated!

bobosha 7y ago
You might want to consider building a chrome extension. Users might have problems recalling your site.
- cxam 7y ago
  Yea, that's always the issue. An extension would be ideal for desktop users and was considering that as a feature, however, for this initial release, I didn't want to alienate any mobile users that may not have the ability to install an extension. Appreciate your feedback and glad someone has the same idea, definitely makes it easier to prioritise features going forward.
  - jbms 7y ago
    With a plugin, people could bookmark/label/index videos themselves within YouTube in a way that is more powerful than what the playlists allow and without needing to resort to browser bookmarks. Being able to distinguish between "my tags" and "public tags" would be necessary.
  - mpfundstein 7y ago
    +1 here. Would be awesome to have this attached to youtube directly.
  - kouh 7y ago
    Mobile users can use firefox extensions

cxam 7y ago

This is the same tagged video I shared in my previous post but without the need for any server-side requests and you can amend yourself: https://tagx.io/video/youtube/7-31KgImGgU/55:52-1:03:30@name:Amazon%20S3%20Access%20Points,1:10:30-1:16:50@name:UltraWarm%20for%20Amazon%20Elasticsearch,1:38:14-1:40:10@name:Amazon%20SageMaker%20Experiments https://tagx.io/video/youtube/7-31KgImGgU/55:52-1:03:30@name...

pensatoio 7y ago

I had this exact same idea in a political context. This could super useful for breakdowns of police footage. Might be wonderful for pro gaming too.

cxam 7y ago
These are pretty good use cases, thanks! I hadn't thought of it in a political context, I can definitely see it work there considering the lengthy footage.

pknight 7y ago

Love what this is trying to solve. If the UX could improve, it would be amazing. While watching it would be great to press a button to generate timestamps and to then compose tracks by selecting any two timestamps, with the ability to add tags to timestamps or tracks while the video is still playing or after. This way you could watch a video in one fluent sitting and work out how to organize with the timestamps you created while watching. One usecase is the ability to link to a comedy sketch from a longer clip and send it to a friend with the link just playing between timestamp a and timestamp b.

cxam 7y ago
Thanks for the feedback pknight. I'll address the points as follow: (1) While watching it would be great to press a button to generate timestamps This is already possible using hotkeys and documentation for it can be found here: https://tagx.io/support/advanced/hotkeys https://tagx.io/support/advanced/hotkeys (2) then compose tracks by selecting any two timestamps, with the ability to add tags to timestamps or tracks while the video is still playing or after Just to clarify, do you mean the ability to add the current point in time of the video to different tracks? In which case, this is already possible using multiple hotkeys as outlined above. Please let me know if this is not what you meant. (3) with the link just playing between timestamp a and timestamp b You are able to create a loop between a tag or a set of tags, please see loop settings outlined here: https://tagx.io/support/interfaces/video https://tagx.io/support/interfaces/video With regards to autoplay, this is a bit finicky depending on the browser and is usually not recommended due to the negative user experience so I didn't include an option to enable this feature. Hope this is clear, let me know if you have any more questions.
- pknight 7y ago
  Thanks! It took me a while to digest how that tagging workflow worked with the hotkeys, but now I get it. That does work! I think one of the things that tripped me up was the lack of visual feedback on the second press of a key. Am I right in thinking that the hotkeys don't work while the video is paused? I guess the other thing I'd love to see is a more dedicated 'share' mode so that you can create a link with a simplified screen that starts playing the track section of a video when the user presses play.

j45 7y ago

Sweet project.. Is there any thought or plan to open source this project to contribute?

cxam 7y ago
It did cross my mind when I released it. I'd like to refactor the code and bring in more tests to make it "contributor friendly" first. Feedback has been great so far and I'll be implementing some of the features on the back of that. There is a repo (https://github.com/cxam/tagx.io https://github.com/cxam/tagx.io) already that I'm using for issue tracking and I'll be able to push the code there when it's ready.
- j45 7y ago
  Nice, I came across the repo after I posted. Even if the code isn’t perfect it’s of interest to me because you also used Vue. With respect to tests, maybe the community can contribute. Will keep an eye on the repo..!