Video Dating App For Twirl

Project Type

Design and development

Industry

Social Media App Development Company

Tech Stack

About the Client

With a fresh new take on the dating paradigm, the folks at Twirl build a vision of a dating platform that utilizes video interactions to help people find love, friendship and even support self-growth through the help of therapists and relationship advisers on the platform, with an aim to promote well-being and love.

OUR APPROACH

We follow a structured and collaborative approach to ensure smooth execution from ideation to delivery.

Each phase is carefully planned to deliver a scalable, user-focused, and high-quality product.

Strategy Analysis & Planning UI/UX Design Development Testing Delivery

Strategy

We worked with Twirl to build an interactive social interaction app, collaborating closely with their team throughout the engagement. The project was initially planned for a duration of ten weeks, but as development progressed and new improvements were identified, the timeline was extended to ensure better outcomes. During this phase, we focused on understanding the product vision, user needs, and business objectives in detail. Regular communication and feedback loops helped us stay aligned and make informed decisions. This approach allowed us to build a strong foundation and set a clear direction for the entire development process.

Analysis & Planning

We chose Flutter to revamp the existing frontend of the application, ensuring a modern, high-performance, and cross-platform user experience. For the backend, we leveraged GraphQL along with Elixir and Phoenix to build a scalable and efficient system. During this phase, we defined the overall architecture, data flow, and key integrations required for the product. Careful planning helped us align the technology stack with performance and scalability goals. This structured approach ensured a strong technical foundation and smooth execution in the development phase.

UI/UX Design

During the first phase of the project, the team on-call worked hard on creating vibrant UI/UX designs which enhanced the overall user experience while also focusing on frontend development. The designs were crafted to be intuitive, visually engaging, and aligned with the product’s goals. Alongside design efforts, the frontend implementation ensured that these experiences were seamless and responsive across devices. Close collaboration between design and development helped maintain consistency and quality. This approach resulted in a polished and user-friendly interface that supported the app’s core functionality.

Development

Over the first phase of the project, the team concentrated on developing various features of the app including Login, Register, Video Listing, Support, Logout, Recording Studio, Like and Favourite, and Report/Block functionalities. This phase focused on building the core user flows and ensuring a smooth and engaging user experience. In the second phase, the development was oriented towards more advanced capabilities such as user authentication, a real-time chat feature, and location-based services. These enhancements helped strengthen the overall functionality and interactivity of the application. Continuous iterations and improvements ensured that the product remained scalable, reliable, and aligned with user expectations.

Testing

To ensure that the app did not feature any lags that could affect the user experience, it was put through multiple rounds of manual testing and User Acceptance Testing (UAT). This helped us identify performance issues, bugs, and usability gaps early in the process. Each testing cycle focused on improving stability, responsiveness, and overall functionality. Feedback from stakeholders and users was incorporated to refine the product further. This rigorous approach ensured the app reached its maximum potential before release.

Delivery

Our collaboration with the team at Twirl led to the successful launch of a dating platform that not only met but exceeded initial expectations. The app gained strong user traction and quickly rose in rankings, reflecting its quality and user appeal. Throughout the release, we ensured a smooth deployment process with all necessary configurations in place. Post-launch, we continued to monitor performance and gather user feedback for ongoing improvements. This resulted in a product that continues to evolve and deliver value to its users.

The Problem

The client's vision was clear. A dating app video video features to enhance the overall experience. They had already published a version of the app for iOS, built in Flutter, GraphQL and Elm. It was a very early build and they had plans for it, but unfortunately could not go through with it at the time. They wanted a new team to look after the product and take it over, while working in conjunction with their own team. One of the partners of the company met our CEO, Sanket, through the React Native Community channels and got introduced to us. They informed their other partners in the company about our reputation and the quality of work that we deliver, which brought the client to our doorstep.

Since the app was in a preliminary stage, we offered a make-over and proposed changes in UI/UX according to market standards. The client gave us approval to both design the app and develop it from the ground up. The initial engagement was to last 10 weeks (3 weeks for design and 7 weeks for development), which was extended because of additional features that were to be introduced.

Team On-Call

Since the work was to be done from the ground up, the project required utmost care and precision during its execution. To ensure that, we employed one Tech Architect for planning, reviews and management, one developer with familiarity in the domain to complete the entire project, one QA engineer to make sure everything is in working order and one designer to build UI/UX for the app.

Requirements

These requirements define the core functionalities needed to build an engaging and structured learning platform. They focus on creativity, collaboration, and controlled access to ensure a seamless user experience.

A mobile app for dating services with built in video calling features.

Browsing features for profiles and videos available on the platform.

Video recording, uploading and playback features in the app through a recording studio.

Role based privileges and user management services.

Development

It was time to get to work. The complete development of this project would include creating designs for the app, implementing them while developing front-end and finally integrating the pieces together and testing the complete product vigorously.

The complete development was divided into two major phases:

Phase 1: UI Development

Phase 2: Integration of the product with backend, testing & deployment.

The base of a video based dating application identifies itself as a vessel to bring people closer and bring meaningful conversations to the surface, driving deeper connections and relationships. The first step of the development process was to upgrade the technology used to build the initial app, which would also cater to the needs of the app and handle traffic well. Flutter was already employed as the primary Frontend toolkit and there was no better choice in the market than it. With Flutter, the best companions to have a well rounded application were GraphQL, Phoenix and Elixir for backend. Once the tech stack was decided upon, the real work began.

The first phase of the project was focused on UI/UX design and Frontend development. The goal of the UI/UX design was to promote simplicity and ease-of-use, while making it look stunning and vibrant. The first 3 weeks were dedicated to the designing of UI screens and defining user journeys in the app, post which the Frontend team started to pick up pace and began translating those designs into code. A total of 5 weeks were spent on building fully functional screens for the various features of the app including Login, Register, Video Listing Tab view, Menu, Profiles, Chat, Settings, Support, Logout, Recording studio, Like and Favourite, Report/Block etc. This concluded the first phase of the project.

The second phase of development involved further Frontend work, some backend development, integration and testing. First, the GraphQL queries were integrated in the app to show details of different users in their profiles and enable/manage authentication. Next, a real-time chat messaging feature was integrated for users to interact with other users on the platform, followed by user actions integration such as like, favourite, report/blog etc. The next important feature that was developed was authentication for new users based on Email as well as the reset password feature.

An integral part of the service is for people to find other people near them using location services within the app. For this, a 'Near me' feed was developed with a location filter to generate accurate results to users and find people based on their immediate geo-location. The complete app also featured context based push notifications and filters based on gender and preferences.

Post development, the product was put through multiple levels of rigorous manual testing to reinstate confidence in every function of the app and sort out bugs that needed to be fixed. The client was kept in the loop through every stage. The product was also put through an intense User Acceptance Testing phase where the end-user tested the product upto satisfaction and reported any discrepancies, if found which were fixed in the following updates.

Overcoming Challenges

All-in-all, the entire application was very straightforward to build and the team understood the requirements quite clearly. The real challenge came while handling the video aspects of the project. The first obstacle came in the form of handling video formats. Being a cross platform app, the video format of native recording and the format that the player supported were different. To solve this, a video converter was used to convert all the videos that were recorded and played to the same format. Also, videos were the main focus of the entire app, the video size had to be controlled to save upload time, storage requirement and buffering speed while playing. To achieve this, video uploading was restricted to a fixed time interval and was rendered in a fixed resolution which achieved a balance between quality, clarity and reduction of storage space usage.

In bird's eye view

Tasks were managed on Trello and Skype was used primarily for communication.
GitHub was used for versioning and source code management.
The app is now live on Google Play Store and Apple App Store.

Final Impression

There were expectations set when we took over this project and the client put his trust in us to take his platform to the next level. It's safe to say that the client was extremely satisfied the results and was impressed by the professionalism that we had displayed during the course of the engagement. They graced us with a 5 star rating on Clutch and mentioned how we had stood up and surpassed the expectations set when the project began. Twirl is now live and is raking in users as expected by the team. We are happy to have developed a relationship with the folks at Twirl and we hope to make it a long lasting one. Nonetheless, it is another feather in our cap and another happy client for us.