Talk to us
Talk to us
menu

Blog Post

start building
Developer

How To Build A Solo Singing Function And Why You Need It

How To Build A Solo Singing Function And Why You Need It

Karaoke has been present since the 1970s, but it has lately grown in popularity in Asian nations such as China and Japan. The proliferation of karaoke clubs in these nations has increased the number of karaoke apps for cell phones.

If you are seeking karaoke solutions, this article will guide you.

Most Popular Karaoke Solution: Solo Singing

The most basic karaoke option is solo singing. It is quick to build and simple to use. It was the first and most popular karaoke solution developed by numerous social programs.

solo singing demo

The picture depicts the most frequently utilized functions in the solo singing solution, which include the following:

  • Set up karaoke rooms.
  • Make a song request from the music library.
  • Form a line to sing.
  • Song singing and display of lyrics.
  • Interaction with the audience’s message.

Why do you need to choose the Solo Singing solution

The most popular karaoke solution is solo singing. Its benefits include:

  • Rapid implement
  • Simple to use
  • Many scenarios are applicable

1. Rapid implement

Solo singing does not require multi-person synchronization and does not require intricate interaction. As a result, development complexity is the lowest, and the development cycle is the shortest. 90% of firms that enter the online karaoke sector will employ the solo singing solution to enter the market. The lowest possible cost may be utilized to validate the market and raise consumers.

2. Simple to use

To begin operations, solo singing merely requires the recruitment of hosts with singing abilities. Since there is no requirement for a large singing user base, it is ideal for the early stages of online karaoke apps. At the same time, it may assist you in gathering people who enjoy music and singing and provide a user base for other karaoke solution operations such as chorus and robbing singing.

3. Many applicable scenarios

Solo singing may be used not only in the live audio room, but also in live streaming, social networking, and other settings. It lets the presenter showcase his abilities more effectively and allows the listener to hear more of the material. Allow your application to be more user-friendly.

Which scene can choose the Solo Singing solution

1. Live Streaming

live streaming

The solo singing option is ideal for live-streaming circumstances. It can help the host showcase their abilities and attract other high-quality hosts to the platform. Simultaneously, it may provide viewers with high-quality live-streaming material and boost user stickiness. Create a virtuous cycle by assembling a community of high-quality, sticky hosts and users.

2. Live Audio Room

live audio room

The live audio room is a voice-based social technique. It must offer a variety of games for people to interact. Music, a crucial element of vocal expression, will inevitably become an important function in the live audio room. It provides a type of entertainment in the live audio room, allowing users from all over the world to communicate in the live audio room through music, even if they do not speak the same language.

3. Online Karaoke

online karaoke

The Karaoke application will incorporate several singing formats, such as recorded singing, solo singing, robbing singing, and chorus singing, so that individuals who like singing and listening to songs may experience the joy that music provides them in various ways.

How to implement the solo singing solution

The most notable distinction between online karaoke and other social entertainment apps is that online karaoke necessitates the usage of music and lyrics. As a result, it is more technically demanding than other social entertainment programs.

The singing voice must be consistent with the accompaniment and words, or a rhythm problem with a tiny delay or freeze occurs. This would impact both the vocalists’ and the audience’s experience.

As a result, the following are the technological obstacles in executing solo singing:

  • What is the relationship between the lyrics on the host side and the accompaniment?
  • How to achieve vocal, compliment, and lyrical alignment on the audience’s side?

I will then demonstrate how to use ZEGOCLOUD SDK to overcome the difficulties and develop a solo singing solution.

1. SDK introduction

ZEGOCLOUD SDK has been carefully tuned for karaoke scenes to provide the same experience as offline karaoke:

  • The end-to-end latency is decreased to 70 ms, achieving no sensory uncertainty for the human body, and users globally may have a genuinely real-time experience.
  • Precise mixing, sound, and accompaniment all blended into a single stream. To hear sound singing effects, listeners need to pull one stream, and the poor network experience is also fantastic.
  • Ultra-low latency headphones, ios20ms+, android 40ms+, allowing vocalists to perform beautiful music while wearing headphones.

2. What do you need to do to implement the solo singing solution?

solo singing

This diagram depicts the entire reasoning behind the solo singing solution. We thoroughly understand the effort necessary to implement a solo singing solution. Different colors symbolize the functions that various roles must carry out.

Green modules reflect the services that music copyright providers must offer:

  1. Obtain the songs.
  2. Download the accompaniment and lyrics files. (If you want to switch between accompaniment and original singing, request an audio file with dual audio tracks from the music copyright provider.)

Purple modules represent what you need to do:

  1. Implement the interface for getting songs.
  2. Implement the logic of ordering songs and lines to sing.
  3. Implement the API for downloading accompaniment and lyrics files.
  4. Implement the notification of sending songs to start singing, reminding users to start loading lyrics and accompaniment.

Blue modules represent the capabilities provided by ZEGOCLOUD:

  1. Lyric display component.
  2. Media player to play the accompaniment.
  3. Microphone audio collection.
  4. The accompaniment is merged with the microphone audio and pushed to the remote end.
  5. The lyrics are synchronized with the accompaniment.
  6. Pull and play the audio stream from the host side.
  7. The lyrics are synchronized with the audio stream.
  8. Signaling channel for sending notifications to users.

3. 5 steps to implement the Solo Singing solution

solo singing solution

As shown in the figure, to implement a Solo Singing solution, you need to implement the following 5 steps:

  1. Create ZEGOCLOUD Engine.
  2. Log in to the singing room.
  3. Get the list of songs and order songs.
  4. Download the song accompaniment and lyrics files.
  5. Start singing.

Below we explain step by step how to implement each step.

3.1 Create ZEGOCLOUD Engine

ZEGOCLOUD Engine is the entry point of ZEGOCLOUD SDK. Before using ZEGOCLOUD SDK’s functions, you must create a ZEGOCLOUD Engine first.

Creating a ZEGOCLOUD Engine requires the completion of the following steps.

  • Refer to Access Documentation to import the SDK into your project.
  • Obtain AppID and AppSign authentication information through ZEGOCLOUD console.
  • Create ZEGOLOUD Engine with the following logic.
private void createEngine() {
    ZegoEngineProfile profile = new ZegoEngineProfile();
    profile.appID = Your App ID;  
    profile.appSign = Your App Sign;
    profile.scenario = ZegoScenario.KARAOKE;
    profile.application = getApplication();
    engine = ZegoExpressEngine.createEngine(profile, null);
}

3.2 Login to the karaoke room

ZEGOCLOUD can log in to the singing room through any RoomID, and use the same RoomID to log in to the same room for interaction.

private void loginRoom() {
    String userID = "Your User ID";
    String userName = "Your User Name";
    String roomID = "test_room_id";

    ZegoUser user = new ZegoUser(userID, userName);
    ZegoRoomConfig roomConfig = new ZegoRoomConfig();
    roomConfig.isUserStatusNotify = true;

    mSDKEngine.loginRoom(roomID, user, roomConfig, (int error, JSONObject extendedData)->{
    });
}

Please note that before logging into the singing room, you need to set up the event monitoring of the ZEGOCLOUD Engine. Avoid some events being lost after joining a room.

void setEventHandler() {
    mSDKEngine.setEventHandler(new IZegoEventHandler() {
        @Override
        public void onRoomStreamUpdate(String roomID, ZegoUpdateType updateType, ArrayList<ZegoStream> streamList, JSONObject extendedData) {
            super.onRoomStreamUpdate(roomID, updateType, streamList, extendedData);

        }
        
        public void onPlayerRecvSEI(String streamID, byte[] data) {
            
        }
        
        public void onIMRecvCustomCommand(String roomID, ZegoUser fromUser, String command) {
        
        }
    );
}

3.3 Get the list of songs, order songs

Next, you must implement interfaces such as obtaining the song list, ordering, and obtaining the list of ordered songs on your business server.

Note that your business background needs to monitor the interface callback of ZEGOCLOUD logged-out room. When a user leaves the singing room, you must remove the song that the user ordered.

3.4 Download song accompaniment and lyrics files

To avoid network issues that cause the simultaneous playback to freeze during singing, the user should download the accompaniment and lyrics files ahead of time.

3.5 Start singing

3.5.1 Notify the singer to start singing

When singing a song, your business server needs to call the send signaling API SendCustomCommand of ZEGOCLOUD to notify room members that a new song will start. The client listens to the onIMRecvCustomCommand callback notification and implements the start singing logic.

public void onIMRecvCustomCommand(String roomID, ZegoUser fromUser, String command) {
}
3.5.2 Start singing
start singing

As shown in the figure, when starting to sing, the singer needs to handle the following logic

  1. Use LRCView to display lyrics.
  2. Use ZegoMediaPlayer to play the accompaniment, and update the lyrics progress according to the ZegoMediaPlayer playback progress.
  3. Turn on the Microphone to collect the singer’s voice.
  4. Combine the accompaniment and vocals into one stream, and add the playback progress to the additional information of the stream.
  5. Push the stream to ZEGOCLOUD Real-Time Server.

The logic that the listener needs to handle is:

  1. Listen to the stream change callback. When a new stream is added, it will pull it from ZEGOCLOUD Real-Time Server and play it.
  2. Use LRCView to display the lyrics, monitor the stream’s additional information to update the lyrics’ progress.

The following will explain how to implement the logic at both ends.

Singer side:

1. Show lyrics You can import the LRCView component in Demo to display lyrics. Add LRCView to your interface by adding the following code in the layout file.

<me.wcy.lrcview.LrcView
    android:id="@+id/lrc_view"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    app:lrcAnimationDuration="1000"
    app:lrcCurrentTextColor="#3F51B5"
    app:lrcDividerHeight="20dp"
    app:lrcNormalTextColor="#BDBDBD"
    app:lrcNormalTextSize="15sp"
    app:lrcPadding="16dp"
    app:lrcTextGravity="center"
    app:lrcTextSize="15sp"
    app:lrcTimeTextColor="#BDBDBD"
    app:lrcTimelineColor="#80BDBDBD"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintBottom_toBottomOf="parent"
    android:layout_marginBottom="200dp"
    android:layout_marginTop="100dp"
    app:lrcTimelineTextColor="#9FA8DA" />

Then load the lyrics file by calling lrcView.loadLrc() method.

private void showLRCFile(String lrcFileName) {
    // Load LRC File
    String mainLrcText = readLrcText(lrcFileName);
    lrcView.loadLrc(mainLrcText);
}

// Read local lyrics file
private String readLrcText(String fileName) {
    String lrcText = null;
    try {
        InputStream is = getAssets().open(fileName);
        int size = is.available();
        byte[] buffer = new byte[size];
        is.read(buffer);
        is.close();
        lrcText = new String(buffer);
    } catch (IOException e) {
        e.printStackTrace();
    }
    return lrcText;
}

2. Create ZegoMediaPlayer

Next, you need to create a ZegoMediaPlayer instance and call the player.enableAux(true) method to combine the audio from the media player and the audio from the microphone into one stream.

At the same time, you need to:

  • monitor the playback progress of the media player through the onMediaPlayerPlayingProgress method
  • update the lyrics progress in the callback
  • send the playback progress to ZEGOCLOUD Real-Time Server.
private  void createMediaPlayer() {
    ZegoMediaPlayer mediaPlayer = mSDKEngine.createMediaPlayer();
    if (mediaPlayer == null) {
        Toast.makeText(this, "createMediaPlayer failed.", Toast.LENGTH_LONG).show();
        return;
    }

    player = mediaPlayer;
    player.enableAux(true);

    player.setEventHandler(new IZegoMediaPlayerEventHandler() {
        @Override
        public void onMediaPlayerPlayingProgress(ZegoMediaPlayer mediaPlayer, long millisecond) {
            super.onMediaPlayerPlayingProgress(mediaPlayer, millisecond);
            // update Lyric progress
            lrcView.updateTime(millisecond);
            // Send SEI infomations
            sendSEIMessage(millisecond);
        }

        public void onMediaPlayerStateUpdate(ZegoMediaPlayer mediaPlayer, ZegoMediaPlayerState state, int errorCode) {
            if (state == ZegoMediaPlayerState.PLAY_ENDED) {
                stopSinging();
            }
        }
    });
}

private void sendProgressToRemote(long millisecond) {
    try {
        JSONObject localMusicProcessStatusJsonObject = new JSONObject();
        String KEY_PROGRESS_IN_MS = "KEY_PROGRESS_IN_MS";
        localMusicProcessStatusJsonObject.put(KEY_PROGRESS_IN_MS, millisecond);
        mSDKEngine.sendSEI(localMusicProcessStatusJsonObject.toString().getBytes());
    } catch (JSONException e) {
        e.printStackTrace();
    }
}

3. Load accompaniment file

Next, use the media player instance created in step 2 to call the player.loadResource() method to load the accompaniment file. After loading successfully, call the player.start() method to start playing the accompaniment music.

private void loadMusicResource() {
    player.loadResource(mp3FilePath, new IZegoMediaPlayerLoadResourceCallback() {
        @Override
        public void onLoadResourceCallback(int errorcode) {
            if (errorcode == 0) {
                player.start();
            } else {
                Toast.makeText(KtvActivity.this, "Load music file failed.", Toast.LENGTH_LONG).show();
            }
        }
    });
}

4. Start singing

Finally, you only need to call the muteMicrophone() method to turn on the microphone, and call the startPublishingStream() method to push streaming. Then you can start singing, and push the audio stream to ZEGOCLOUD Real-Time Server.

private  void startSinging() {
    singingStatus = SingingStatus.Singing;
    btnStartStop.setText("Stop Singing");

    loadMusicResource();
    Random random = new Random();
    int randomInt = random.nextInt(1000);
    String streamID = "stream1" + randomInt

    mSDKEngine.muteMicrophone(false);
    mSDKEngine.startPublishingStream(streamID);
}

Listener side

1. Add a callback to listen to the room stream update and play it

On the listener side, you only need to monitor the SDK’s stream change callback method onRoomStreamUpdate(). When a new stream is added, call the startPlayingStream() method to start streaming, and you can hear the singing voice and accompaniment pushed by the singer.

public void onRoomStreamUpdate(String roomID, ZegoUpdateType updateType, ArrayList<ZegoStream> streamList, JSONObject extendedData) {
    super.onRoomStreamUpdate(roomID, updateType, streamList, extendedData);

    ZegoStream stream = streamList.get(0);
    String playStreamID = stream.streamID;
    if (updateType == ZegoUpdateType.ADD) {
        mSDKEngine.setPlayStreamBufferIntervalRange(playStreamID, 500, 4000);
        mSDKEngine.startPlayingStream(playStreamID);
    } else {
        mSDKEngine.stopPlayingStream(playStreamID);
        lrcView.updateTime(0);
    }

    updateSingingStatus(updateType == ZegoUpdateType.ADD);
}

2. Monitor the lyrics progress callback and update

Finally, by listening to the callback method onPlayerRecvSEI() of the SDK, get the singing progress of the song, and call the lrcView.updateTime() method to synchronize the progress of the lyrics.

public void onPlayerRecvSEI(String streamID, byte[] data) {
    String dataString = new String(data);
    try {
        JSONObject jsonObject = new JSONObject(dataString);
        String KEY_PROGRESS_IN_MS = "KEY_PROGRESS_IN_MS";
        long progress = jsonObject.getLong(KEY_PROGRESS_IN_MS);
        lrcView.updateTime(progress);
    } catch (JSONException e) {
        e.printStackTrace();
    }
}

Run a demo

After completing the above steps, you complete a Solo Singing solution, allowing your hosts and users to enjoy richer entertainment content.

The following shows you the karaoke demo. You can also download the Demo source code to learn how to implement the solo singing solution.

Conclusion

Online karaoke has quickly become the most popular form of entertainment; simply follow the instructions below to incorporate the karaoke capability into your application.

1. Locate a copyright service provider to supply copyright services for your business.

2. Construct a song request server.

3. Install the ZEGOCLOUD SDK to provide you with a high-definition singing experience.

I feel that the karaoke option may propel your business to new heights by attracting higher-quality hosts and users. Make valuable entertainment material for your platform.

ZEGOCLOUD
ZEGOCLOUD With our fully customizable and easy-to-integrate Live SDK, you can quickly build reliable, scalable, and interactive live streaming into your mobile, web, and desktop apps.

Related posts