Social Media App For Liviit
Social Media App For Liviit
- 1
Strategy
Keeping the project of building a social media platform in mind, the initial strategy was to introduce a fixed timeline model, which then transformed into a time and material model considering the scope and benefits.
- 2
Analysis Planning
Considering an upgrade from RoR, the choice of tech stack for this project was React Native, given the sheer versatility of the framework, with AWS S3 and Exchange Server in the backend.
- 3
UI/UX
We implemented wireframes to understand user journey and derive the most efficient experience, while using the latest design systems, as per the client's demands.
- 4
Development
The first milestone marked the completion on UI, followed by a user management system, a linked accounts feature, hubs management, to-do's management and a feed management module.
- 5
Testing
At the end of each sprint, the finished product was delivered to the client for UAT and feedback was implemented on to make the app more stable.
- 6
Delivery
With over 3 years of development, the project is still ongoing with new improvements and features being implemented regularly.
After running a relatively simpler web-app for 8+ years, Matt Robertson, the founder of Liviit, decided to switch gears and bridge the gap that was created by the shift in the technological paradigm and the rise of mobile. A visionary man with a plan, Matt set out with the tedious task of looking for the perfect technology to shift on and the perfect team to help him with it. Liviit was originally designed to assist people in their day to day lives by streamlining their daily activities in their busy schedules. With just a functional web-app that featured 'Private Hubs' & 'Community Networks' and futuristic ideas, Matt wanted to build a Mobile App for his concept.
First Steps
Following an extensive research on mobile options, online tutorials, which led him to Tech-Talks held at GeekyAnts and his purchase of NativeBase Starter Kit Pro, Matt reached out to GeekyAnts on May 5th, 2018 with the hope of a solution. He explained his vision of producing Liviit 2.0 on mobile and put forward a list of requirements that would help him achieve his goal.
After a quick discussion with the Business Development Team, Matt successfully hired GeekyAnts to make his dream a reality with a team of two React Native engineers and one Laravel engineer for backend development. Initially, Matt wanted to follow a fixed timeline with a fixed cost plan but understanding the scope and benefits of sprint-wise Agile, he quickly followed and agreed to it.
The only thing left to do now was to get to work.
Faiz Ahmed was the designated lead for this project. Armed with a team, he proceeded to execute the first step of the plan, understanding the requirement from a technical perspective. The first step was to decide the tech stack for the project and devising methods to achieve different features of the web-app into mobile. With a quick discussion and with the team’s expertise, React Native was finalised as the framework on which the app would be built, Laravel was selected for backend APIs, MariaDB for database, CentOS for server and AWS S3 for centralized file storage.
Concept
Liviit’s concept is to define the need of people being driven away by the concept of social media. What fascinated us to work on the project was the perfect solution that has been in need for many of us.
As a user, we often run into unnecessary content or the content not advisable for our kids. Liviit aims to provide a safe platform where we do things based on only what we need. We brainstormed together and created our own principles: Guide Your Users, Consistency, Efficiency. By looking at this design principles, we had to think about what we can do to apply them in use.
UX Challenges
The initial design of the app served the purpose of being used only on the desktop. There were many major features which needed go onto the mobile app keeping in mind that the new design does not loose its touch. With so many features, one could only think of an app like a combination of multiple app into one. We have been struggling with the notion of having a uniform usability unity across the platform. Not only the function but the design also had to go well along a good visual content.
UX Goal
To create a usage standard and logic in the way that the function of the app are implied upon the usage of devices. The main features of the app will sit right on the screen ensuring that the users are not missing them out. User could also control and navigate their kids to what is the most important and block to what is not.
Main Features
Brainstorming and Wireframes
This process was carried out to understand the complete flow of the app and to clearly define all the main functions of it, before proceeding to high fidelity wireframes.
High fidelity wireframes were later done to visualise and check the whole function of the app. This has given us a better view of the app functionality.
Colour Pallet
The primary colour of the app was chosen by the client and had to complement the rest of the colour scheme in such a way that it either created a contrast of colours or blended with them.
UI Screens
The design of the app was structured with all the components that was made throughout the design stage. The principle of the design was human centred to maximise the potential of the app.
The Execution
With everything set in place and an agile method to supplement communication and workflow processes, the team wasted no time and got on top of the task at hand. The plan was to deliver every major release at an interval of 2 weeks.
The first week would be well spent into crafting an impeccable UI and reliable API’s and the second week would be dedicated to integrating the two and testing the end result rigorously, before presenting it to the client. Post that, feedbacks from the client were to be taken and work would continue till the project was satisfactory to the client. In all, there were 6 milestones in between the initiation and successful completion of the project. Each milestone covered a major chunk of the overall application and was delivered on time, without exceptions. The first milestone covered User Management, followed by Linked Accounts Management, Hubs Management, To-do’s Management, Vaults Management and finally Feeds Management.
The GeekyAnts team would take up the responsibility to create the Front-End of the app with the Liviit team taking up the task of QA and testing. There were six milestones that were decided for the application development cycle.
The old Liviit was designed to be deliberately simple from a UX point of view. Going back 8+ years ago a responsive webapp with Bootstrap and Rails was the way to go but times changed so quickly and mobile first took over. The GeekyAnts team I think at the start of the Liviit 2.0 journey understood the general concept but as time has progressed they have learnt more intimately the complexity of what is actually required. This to me has always been the missing link with my previous dev team.
- Understand the concept
- Appreciate what is required
- Streamline the design
- Communicate the value-add options
- Mutually agree on the solution (function by function, feature by feature)
- Deliver a much better end result that maintains simplicity but with more functionality.
In the words of Seth Grodin 'knowing when to quit might be the best lesson you can learn'. I made the decision 18 months to quit the webapp forgoing lots of effort and of course money. I researched the mobile options, endless techstacks, online tutorials and also who could help me deliver the solution. Thanks to NativeBase and all of your TechTalks. I chose GA and at this point in time I could not be more pleased.
The Agile system helped keep Matt in the loop of everything that went on with the project. Every small detail was conveyed and the constant back and forth communication was vital for this project’s success. One of the major challenges faced by the team was to understand exactly what Matt wanted his app to look and function like. Since this was a COPPA compliant project, another challenge was to define roles and permission for each and every type of member, but these obstacles were overcome with the solution oriented approach taken by the team towards the problem and Matt’s patience to explain his ideas in vivid detail.
- AWS S3
- Exchange Mail Server