How to Live Stream a Video with a Mobile!

The phenomal rise of video over internet (what we call “Streaming” or “OTT”) over the past few years made your video content king again. Live Streaming became a de-facto standard to attract new people to your web site, to your company or to your products.

It’s now possible for businesses of any size, of any type, from anywhere in the world to live stream events, conferences, corporate meetings, webinars, etc. There is basically no limit and this can now be done with minimal investment (if any!) and for a predictable and near-zero cost. Mobile phones now have incredible video capabilities and can be used to replace expensive cameras, making it even easier to start.

This post will take you through the different steps that are required to air your live content from your mobile phone to your website. This really is a 15 mn exercise the first time you do it, and a 3 mn exercise once you are used to it. So be brave, don’t drop the ball and be a star! 🌟

Table of Contents:

  1. Create an account in Quortex I/O (it’s free, and we won’t bother you)
  2. Install a streaming app on your phone or on your laptop
  3. Create your live stream
  4. Configure your live stream
  5. Connect your live event to the streaming platform
  6. Test your streams!
  7. Embed your streams on your web site
  8. You’re all set!

1. Create an Account in Quortex I/O

Obviously, you will need to create a Quortex I/O account. This is a 1mn process that will give you access to the most powerful and widely used streaming platform. All you have to do is go there: https://www.quortex.io?#tryforfree and enter your details. You will be given free credits to start with; we don’t ask for any VISA card number; we don’t ask for any commitment; and we promise we won’t harass you to go any further!

2. Install a Streaming app on your Phone or on your Laptop

The event you want to stream happens on the ground, right? And you need a way to take this stream from your phone or camera to the Quortex I/O cloud platform. There are plenty of options here, let’s explain!

The right protocol

There are two protocols that can be used to take your stream from the ground to the cloud: RTMP or SRT. Don’t be afraid of these acronyms, both protocols are mature, well established and widely used protocols. We tend to prefer SRT over RTMP (SRT is meant for professionals while RTMP is more for prosumers).

Stream from your Phone

There are plenty of free apps that can be used to stream your camera to the cloud; we don’t have specific partnerships here as we want to be as opened as possible, but you can use for instance Larix Broadcaster (available on iOS, Android or Microsoft platforms).

Streaming from my phone
Larix Broadcaster for Android Screenshot

Stream from your Laptop

If your are absolutely new to it, OBS Studio is an great software that will capture any sources on your laptop (external cameras, webcams, or even your screen) and create a stream that can be ingested on Quortex I/O. You can check the details here.

3. Create your Live Stream

Log in to your Quortex I/O Account (just go to https://web.quortex.io). Click on “Create a pool”, you have to select two things:

  1. The closest possible location to your event, from the “Input Region” list. It’s an important choice, as the workflow will be deployed as close as we can from your source to minimize the latency and maximize the quality of the link between your event and the Quortex I/O platform.
  2. The region you want to stream your content to. You can choose ‘Worldwide” if you are unsure what to do here!
Log in to Quortex I/O and start the process to get a live event with a professional result.
Select your input and streaming region

On the next stream, just click on “SRT stream” (that’s what we are going to use). Just select “Listener Mode”: this means that the Quortex I/O platform will wait for incoming connections coming from the app on your phone. We’ll see later how to actually connect your phone to the Quortex I/O platform.

SRT Stream in Quortex I/O

4. Configure your live stream

Streaming is different of broadcast as the video is sent in multiple bitrates (eg video size in bytes) and resolutions (eg video dimensions in pixels) to accomodate for different watching devices and different network conditions (a mobile phone in the underground has obvisously not the same needs and capabilities than a Smart TV connected to a fiber, DSL or cable network).

Although Quortex I/O offers a lot (really, a hell lot!) of flexibility, you can also choose to start with the predefined settings (“presets”) that will fit most of your use cases. Of course, we encourage you to go more in depth into these settings (feel free to reach out, we’ll be happy to help!) but using the presets is just fine.

Hence, all you have to do is to click on “Add” and “Next” to choose the ‘”Processing” (that relates to bitrate and resolution) and “Target” (that relates to the device you want to address).

Quortex I/O images
Configure Processing and Target

You’re basically done :). The next screen shows the “publishing point”, ie the URL you will publish for users to watch your stream. Just click on “Next” after (optionally) naming your pool, and you’ll be all set!

Quortex I/O super easy pool settings
Just click on “Next”!

5. Connect your Live Event to the streaming platform

The platform is now setup, ready and waiting for your camera stream to be connected! Let’s connect your phone to the platform so your live streams can be watched by your audience.

In the Quortex I/O platform, you configured a “SRT Listener”. It means that the platform will automatically provision an endpoint on which your phone will be able to connect. This endpoint is displayed in the input listing.

How to connect your live event to the platform
Quortex SRT Listener parameters

On your phone, in Larix Broadcaster, go to the Settings/Connections, and select “New Connection”.

  • In the “URL” field, type the Quortex Server Address
  • In the “Passphrase” field, enter the Passphrase (a passphrase is automatically created by the Quortex platform to ensure your stream is fully private)
  • Leave other fields to their default values
Streaming app on your phone to get a perfect live streaming thanks to Quortex I/O
Larix Broadcaster for Android settings

Then, in Larix, just click on the record button … and … you’re live! You can check the status in Quortex I/O.

your event is live!
I’m Live!

6. Test your streams!

Your streams are now ready to be streamed anywhere in the world : ). Prepare to be a star! You can immediately test them (before embedding them in your web site) by playing the URL given in the publishing point.

You can test that your stream is live by going to this online video player, and copy/paste the stream URL to immediately start playing your stream!

Test your streams in Quortex I/O
Play in dash.js

Tadamm ! You can now watch your stream on the web!

Test of live streaming on mobile
Live in a test player

7. Embed your streams on your web site

OK! The last part is to actually publish this video in your website. If you have Web developers in your team, this should be a no-brainer. We even have online help articles explaining it in detail.

What you have to do is basically embed a few lines of code in your web site. If you are using WordPress, Wix or any other CMS, this is done by inserting “Custom HTML” code. Literally, you can just copy paste the lines of codes in our Help Center articles, just replacing the “manifestUri’ in the sample code below. Don’t panic if you don’t feel OK to deal with that, we can help!

    <script src="https://cdnjs.cloudflare.com/ajax/libs/shaka-player/3.2.0/shaka-player.compiled.js" integrity="sha512-9SpI4t+0FNlrOTC/bkahpYAV5gNXALQBZXk0zew1HQ9Am5iugZ7dgbIvNhL01GkyY+xDkdMagOAQizXUa2y/gQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <!-- Your application source: -->
    <script>
      const manifestUri =
          'https://3gs7e6ji.live.quortex.io/live_event/1080p_25_fps/dash_target/index.mpd';

      function initApp() {
        shaka.polyfill.installAll();

        if (shaka.Player.isBrowserSupported()) {
          initPlayer();
        } else {
          console.error('Browser not supported!');
        }
      }

      async function initPlayer() {
        const video = document.getElementById('video');
        const player = new shaka.Player(video);

        window.player = player;
        player.addEventListener('error', onErrorEvent);

        try {
          await player.load(manifestUri);
          console.log('The video has now been loaded!');
        } catch (e) {
          onError(e);
        }
      }

      function onErrorEvent(event) {
        onError(event.detail);
      }

      function onError(error) {
        console.error('Error code', error.code, 'object', error);
      }

      document.addEventListener('DOMContentLoaded', initApp);
  </script>

8. You’re all set!

That’s it. The floor is now yours. We have a full support team to help you with all this if you end up being scared after this article. Don’t be shy, reach out to us!

Quortex

Société par actions simplifiée au capital de 101.242€
1137A Avenue des Champs Blancs
35510 Cesson Sévigné
FRANCE
RCS Rennes 842 176 141
email: info@quortex.io

Publication Director: Marc Baillavoine