General

How Web Technologies Helped Build a Cross-Platform Desktop App

0

Spreaker’s first incarnation of its recording and streaming tool was the web-based, browser console, and though it is the oldest piece of software in our ecosystem, it still continues to serve many podcasters to this day.

However, since then Spreaker has continued to evolve. In fact, just last year we decided to build Spreaker Studio for Desktop, a downloadable desktop app that brings a whole new look and feel to Spreaker’s podcasting tools.

So why the need for the update? The answer is simple: every piece of software has an expiration date…well, sort of. It doesn’t mean that one day that software will just stop working, but that technology moves so fast that the line between impossible and possible constantly shifts.
One of our missions is to give podcasters tools that are intuitive as well as feature-complete, so that the only thing they’ll ever have to worry about is creating great content. It’s up to us to provide state of art of technology.

THE GOALS:

We started the project with clear goals in mind:

  • Spreaker Studio for desktop would be usable and provide a slick UX (user experience), and would follow the direction previously taken with Spreaker Studio for Android and iOS.
  • It would be easy for users to install on both Apple and Windows computers.
  • It would work with as many professional external devices as possible (mics, mixers, etc..).
  • It would be open to integration with third party software.

HOW WE DID IT:

At Spreaker we love web-based technology, so we decided to build our desktop application using just that. Spreaker Studio is standing on the shoulders of great open source programs (and of course some of our own magic).

  • ReactJS

    React JS is the core library we used to build the app interface you’re familiar with. Its strengths are its powerful component base abstraction and impressive performance rendering, which are both necessary in creating a slick and smooth experience.

  • Electron

    The Electron project is basically a Chromium Browser (the open source project under Google Chrome), but without its, or any regular browser’s, limitations. Every time you open Spreaker Studio, you’re essentially opening a thin, optimized version of Chromium with multiple abilities. Electron can talk with native installed libraries, write files to a filesystem, write to a database, and talk directly to the low level hardware of your PC or Mac.
    Electron was born within GitHub as a foundation for the Atom Text editor, and lots of other projects are currently using it (Visual Studio Code by Microsoft, Slack…).

  • A native audio library for audio mixing and processing

    A native audio library for audio mixing and processing
    Since Electron has the ability to talk directly to native libraries, our CTO Marco decided to write a common audio library that handles all the app’s hard work. This includes all audio related processing, mixing, and third party device recognition. This core library is the same for Windows, OSX, and our Android mobile app. The great thing about this approach is that as soon as we develop any function at this level (ex: auto ducking), we can port it to all of Studio’s supported platforms with little effort.

  • Love and Care

    Ok, this is not very tech related, but is still a fundamental ingredient. We built the app using all the feedback we’ve received from you all these years, and are constantly improving it with your requests in mind.

THE OUTCOME:

That is up to you to say! Please share your own Spreaker Studio story with us so that we can continue to improve it.

P.S.

If you want to know something more about the technology we used, you can listen here:

Or check out these presentations on Slideshare:

You may also like
3 Social Media Strategies for FaithCasters
Spreaker Studio for Mac and Windows: What’s New!

Leave a Reply