100ms Logo
Video Conferencing App For 100ms
Developing video conferencing SDKs to enhance the 100ms application
Timeline
Timeline
Ongoing
Industry
Industry
Entertainment
Location
Location
India
Project
Project
Development
Year
Year
2022

  1. Strategy

    We joined hands with 100ms, a SaaS company which helps to integrate video conferencing on mobile apps to improve their offering by creating SDKs and APIs to improve the functionalities of the app. 

    1

  2. Analysis Planning

    As the existing application was built on React Native, we decided to stick with the same and use Redux for state management.

    2

  3. UI/UX

    The project was primarily focusing on development with the clients having implemented the designs because of which our designers lay easy on this one.

    3

  4. Development

    The development phase revolved around implementing a React Native package which coils assist in the integration of APIs for features like mute/unmute, join/leave room, adjusting audio levels, a chat feature amongst others.

    4

  5. Testing

    Accuracy was ensured during the development phase through unit testing where our in-house developers broke down and tested each segment of code iteratively. 

    5

  6. Delivery

    The client is delighted with the progress on the application and several APIs are still being tested and implemented to improve the user experience.

    6
About the Client

Based out of the Silicon Valley of India, 100ms was founded by a group of visionaries who wanted to change the way infrastructure was built for live apps and enhance the development experience. Their brainchild- the 100ms application, features top-notch audio-video quality and is built on top of flawless code written by industry experts to offer a powerful experience for developers. 

The Problem

100ms team specialises in building video conferencing SDKs supported by powerful infrastructure to provide for flawless development and expedite the process. The partner’s requirements were simple; they required us to integrate SDKs for the mobile version of the application that were built on top of React Native and make other enhancements.

The 100ms team came across us through a recommendation, and they singled us out as the apt tech partners to take the project forward considering our expertise with the tech stacks. 

Team On-Call

The client’s primary requirement was to put together a team to enhance their apps and considering they did not have an in-house team, they decided to onboard GeekyAnts as the tech partner to take the project forward. Considering the nature of the project, the particulars were extensively discussed before putting together a team which would consist of React Native developers spearheaded by a Tech Lead. 

Requirements

The client required us to implement APIs for joining/leaving rooms, role changing, muting/unmuting and ending rooms.

We also integrated chat messaging to transmit messages to intended users. 

The client also required an HMS logger which could automate the debugging process. 

APIs which could communicate on the native side were also implemented through the provision of a React Native bridge. 

Development

After picking out the right group to take the project off the ground, the next step was to finalise on the technologies which would be used to enhance the application. As the major scope of the project would involve building a package for an existing application built on React Native, our team decided to align our choice of tech stack with the same. 

Our team was also required to implement packages for Android which were handled using Kotlin, a programming language for high-quality android development. Simultaneously, we also implemented packages for the iOS version using Swift, a powerful and intuitive programming language for iOS that promotes interactive development. Redux was the library of choice for managing and centralising the state of the application as it provides for consistent coding.

The first phase of the project was dedicated to creating a React Native package which the team handled by creating APIs and a bridge on the native side and connecting it to a corresponding React bridge using methods like promises, callbacks and EventEmitters. Depending on the API that has been chosen, we proceeded to implement a one way connection if required which permitted us to encode and decode data for reconnecting the APIs and the React Native SDK for the end-user. We used an example application to demonstrate the workings to our partner and on receiving approval, we got down to implementing the features as follows:

  • Join & Leave Room API’s: These are the most basic APIs to interact with the HMS SDK.
  • Mute & Unmute API’s: This API requires a boolean to mute or unmute the current track state.
  • HMS View: This is a type of view which we have exported from native sides and its architecture consists of a simple view providing swift and frame layout for the Android version.
  • Chat Messaging API’s: This API takes a message string and sends it across to intended users.
  • Event Listeners: We used NativeEventEmitter to emit the events that we capture on the native sides and pass them through the bridge to the React Native side so that event listeners do not miss out on updates
  • Role change & Tracks change API’s: These APIs are used to change the current status of the room for local peers
  • End Room API: This API is used to forcefully end the room for all the members in the meeting.
  • Setting Audio Levels: This API sets the incoming audio for the local peer.
  • HMS Logger: This helps to login all the events and updates to help with the debugging.
  • Recording & Streaming API: This API is to start the recording/ streaming in a current room. It can stream the current room to the given link as well.

The team followed unit testing wherein they broke down the code and tested it in smaller bits to ensure that each segment was without drawbacks and functioning as intended. GitHub was the repository of choice and we handled it to interact with the client about updates as well as for code and task management.

Overcoming Challenges

We, at GeekyAnts, believe that research and learning is the arsenal to overcoming challenges and this helped us go a long way during the course of this project. The major roadblock that our developers ran into was working with Swift and Kotlin considering they did not have much experience with the tech stacks which they overcame through practice. Meanwhile, they also faced issues when the APIs were in the beta stage where they’d face native SDK issues which were solved promptly by the team at 100 ms. Another challenge faced by the developers at GeekyAnts was in debugging client issues which they solved through collaboration with the folks at 100ms.

Final Impression

The engagement which started earlier this year is still ongoing with new functionalities being implemented to the 100 ms application. The client is extremely pleased with the process so far which they claimed had been productive with the team’s ability to communicate and collaborate to solve problems effectively. The workflow so far has been seamless and frequent updates and transparency has helped the engagement to a successful one.