Case Study: Creating The 'Photoshop' of Subtitles

img
Time to read:
7 min
img

Product: SubbXI Media

Backend Tech Stack:Node.js, TypeScript, Nest.js, gRPC, Socket.IO, Amazon ECS, Amazon S3, FFmpeg

Industry: Media, Video Captioning

Ask anyone at Fulcrum, what our most beloved product is.

It’s SubbXi.

It’s complex, smart, and versatile. In general, SubbXi is the most advanced app we ever created.

Ok. What's SubbXi?

SubbXi - innovative platform for creating subtitles. Thanks to SubbXi, digital agencies can cooperate on captioning videos or movies.

Tech Advancements Inside:

SubbXi is jam-packed with tech advancements.

First of all, it has complete micro-services architecture. The system is independent and smart, to the extent where it automatically adjusts to any traffic load.

Say, one of SubbXi services experiences a traffic spike. In this case, the new server instance of this service will be automatically launched.

Frontend Tech Stack:TypeScript, React.js, Redux.js, Socket.IO, Jest, Sass, Heroku

Backend Tech Stack:T Node.js, TypeScript, Nest.js, gRPC, Socket.IO, Amazon ECS, Amazon S3, FFmpeg

We decided to switch to gRPC instead of REST for communication between servers. gRPC is the lightweight framework built completely on HTTP 2.0. It's faster & more convenient.

This is the topic for another article, but gRPC is not yet supported by AWS load balancers. How did we solve this? We decided to use Envoy as a front-end for each server and as side car for each separate instance of the specific server.

Apps speaking your language
We create awesome web & mobile apps. Learn what it takes to create your perfect product.
Talk to us

How does this work?

Entire team can cooperate on captions in real-time.

By default, we added roles for a translator, transcriber and a proofreader. You can always add more.

You can create the project, upload the video, share it with co-workers & download video with hardcoded subtitles in different formats. In addition, it's a piece of cake to assign specific tasks to your coworkers. As a result, they would be able to work with your video (or its part), share the project with the team or publicly.

SubbXi automatically converts each video into HLS after the upload. Thanks to HLX, videos can be streamed. This also helps to secure the project. For instance, certain users can't illegally distribute your movie, since there will always be a watermark with a unique user id.

The platform is convenient & extra easy to use. Did we say it's like Photoshop? It's so much easier.

Task management is a breeze. SubbXI shows all current projects in 1 convenient preview. You can immediately see their status & people who are working on select projects, languages, project's due date & more.

It's also possible to filter videos by their status (to do, in progress, done, waiting for confirmation, assignment date, end date, etc).

AVI, WMV, MOV, QT, MP4, FLV media files.

Subtitles support: VTT, ASS, SRT, TXT

The cherry on the top: some video formats (more specifically AVI, WMV, FLV, MKV)

The Workflow

Suppose, you wish to create a new project. After you sign in, you will see a quick pop-up. Simply enter video's name, choose the desired quality rate and select the required language for subtitles.

Many people can cooperate on 1 project in real-time. But this doesn't end here. You can also leave comments & chat with any colleague you wish.

Step #1. Create a new project & upload the desired video Step #2. Set the parameters for captions & invite co-workers Step #3. Transcribe the movie to any desired language. Step #4. Download the movie with subtitles completely ready.

As developers, we wanted to make Subxxi as convenient to use as possible. It responds to multiple hotkeys and shortcuts like Ctrl+ Z (this will revert the 3 last actions).

Compatibility

Compatibility is extra important here. Any user should be able to seamlessly work on a project no matter what tech he/she uses.

Therefore, Subxxi works flawlessly with all widespread browsers: Chrome, Firefox,Safari,Opera, Mozilla Firefox (even Internet Explorer).

Initially, the app supports:

.avi, .wmv, .mov, .qt, .mp4,.flv media files.

Subtitles support:

vtt, ass, srt, excel based format (must be designed), txt

The cherry on the top:

some video formats (more specifically .avi, .wmv, .flv, .mkv) support hardcoded subtitles. In this instance, subtitles will be hardcoded into the movie on-the-fly (during the download).

SubbXi Team Says:

So far, the work from Fulcrum has been top-notch, in terms of both functionality and visuals. Their team works diligently to meet deadlines and communicate smoothly, despite any language differences.

RESULTS

SubbXi is a complete, user-friendly platform for captioning movies. It's fast, flexible, fault-tolerant.

With SubbXi, captioning agencies can create subtitles for any move in just 1 day. It's seamless. Even if many people collaborate on 1 project - the platform stays stable.

Apps speaking your language
We create awesome web & mobile apps. Learn what it takes to create your perfect product.
Talk to us

Olekii
Oleksii Sekundant
Business manager
imgimgimgimg
Blog
Blog
How to Create SRS for Edtech App: Don’t Reinvent the Wheel, Take What’s Already Written
A SRS document template to rock any edtech app. Success recipe is simple: read, adjust and use.
outsourcing
2020-09-22
Blog
Kick Off Your Education App Development
Education app development has never been easier. Learn how to create an edtech app on real cases.
outsourcing
2020-09-07
KICK-START YOUR PROJECT
Learn what it takes to create your perfect product.
Speak to us