Twirl Logo
Video Dating App For Twirl
Making finding love, friends, and maintaining self well-being come together in a video-based Social Interaction App.
Client
Client
Twirl
Timeline
Timeline
10 weeks
Industry
Industry
Social Media & Communication
Location
Location
USA
Project
Project
Design and development
Year
Year
2020
  1. Strategy

    We worked with Twirl to build an interactive social interaction app where we engaged with them over a period of what was initially set to be ten weeks but was extended as progress on the development process was made.

    1
  2. Analysis Planning

    We chose Flutter to revamp the existing Frontend of the application along with GraphQL, Elixir and Phoenix to complement the Backend.

    2
  3. UI/UX

    During the first phase of the project, the team on-call worked hard on creating vibrant UI/UX designs which can enhance the user’s experience while also concentrating on Frontend development.

    3
  4. 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, Report/Block etc. while the second phase was oriented towards the creation of features like user authentication, a real-time chat feature, location services etc.

    4
  5. Testing

    To ensure that the app did not feature any lags which could affect the user experience, it was put through multiple rounds of manual and User Acceptance Testing to improve the product to its maximum potential.

    5
  6. Delivery

    Our interaction with the people at Twirl brought about the launch of a successful dating platform that has surpassed the expectations set and rose in rankings amongst users.

    6
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.

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

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.