
Show HN: Tagx.io – Create/share video highlights and annotations - cxam
https://tagx.io/
======
cxam
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
You might want to consider building a chrome extension. Users might have
problems recalling your site.

~~~
cxam
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
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.

------
cxam
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...](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)

------
pensatoio
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
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
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
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
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.

~~~
cxam
Great, glad this worked well for you. I agree with your point on the visual
feedback. Depending on which tab you have active, it will always show the
newly created tag on the list when created. However, maybe a short-lived toast
message could work better here.

You're correct, the hotkeys won't create a tag when the video is paused,
instead it will start playing the video on first press then you'd need to
press it again to actually creat the tag. If you want to manually create tags
without playing the video then this can be done on the tracks interface. The
"+" button in each track will display the modal to do so.

With simplified sharing, would you expect to show only the video without any
of the tags and tracks on display? There are existing layout options you can
customise such as hiding the tag/track listing and the tagging controls, even
resizing the video. However, the play button just plays the video as normal. I
think what you're suggesting with the play button only playing the tracks when
shared in "simplified mode" would provide a cleaner interface to the end user
without the additional components displayed.

Thanks again for the feedback, if you do have any other ideas and this post
gets locked for commenting after two weeks, then please don't hesitate to
create an issue or drop me an email as listed here:
[https://tagx.io/support/general/contact](https://tagx.io/support/general/contact)

~~~
pknight
Thanks! And yes, with simplified sharing it would be ideal to only have the
player with just the track targeted and nothing for the person receiving the
link to guess. So if you send someone a sports highlight, or a specific sketch
from a comedy show, or a specific exercise explained in a tutorial, they only
need to press play and it would only play the track, not the whole video.

Your app definitely has a lot of utility.

~~~
cxam
Great, I think this is something I'd like to bake into the next release.

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

~~~
cxam
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
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..!

