Wanna know how I cloned one of the world's best UI/UX android Applications?
Ok let’s start with, what is the app name?. The original App name is AIRBNB but I kept the cloned App name as FLAIRBNB isn’t it fun😁. let’s get into the actual story, my name is Vinod Kumar C. from Bengaluru. As I was about to graduate from Masai School, I was challenged to design a complex UI/UX App called Airbnb as I was a bit poor in-app UI designings, so I accepted the challenge and started working through it.
In the beginning
I started using the original app, in the original, they are using the complete material design as I was very far from the design, I started thinking about how to do these designs, I went through the various helper platforms like Mindorks, Stackoverflow and finally found-out some solutions which do not make any sense at the start, but after going through the complete code walk got a better understanding about the UI/UX components and also understood how to make a material prototype for a complete project. Then I started to gather all the resources needed to implement and make a note of step-by-step procedures needed to make such design.
Wondering who challenged me
It’s none other than Vinod Kumar C (it’s Me LOL). Yes as I was much better at backend stuff, but I haven’t taken a chance to design the complex layouts before, but this time I took it as a challenge and the results are like…never mind. Just see the below screenshots. (zoom out a bit for better view)
Now let's talk about the tech stuff
The best thing about this project is, whatever I learned from the Masai School till now was put together as a compressed zip file and showcased in form of this project.
Tech-Stacks used
- Jetpack Navigations — one Activity, many Fragments.
- Kotlin and Java — used a 9:1 ratio.
- Firebase — for storing real-time data and authentications.
- Firebase Storage — for storing real-time photos.
- GoogleMap Sdk — for place locations. (The Most Difficult Part)
- MVVM Architecture — for better development.
- Dagger Hilt — for simplified dependency injections.
- Material Designs — for the backdrop, buttons, and cards.
Key Features Included
- Users can see all the nearby places and book whichever they want.
- Users can host their place to make money.
- Bill exporting to Pdf and Screenshot.
- Secure payment gateway (Razor Pay).
- Handy to use.
Let's see more screenshots.
Journey
Well, I was all alone developing so no restrictions no rules. As working in a single-minded environment, results came very much positive I was able to implement the new SDKs in a very short span of time.
Finally
I just want to say thanks to the Masai School and the Masai team for their continuous support, and for making me a Full-Stack Android developer.
Source Code and Build Apk
Github Link (v-1.0): FlairBnb Repository
FlairBnb 1.0 APK : FlairBnb Apk
App walk-through: Complete Walk-Through
Thank You for your precious 5 min, never mind my English you can’t expect more than this from a vernacular medium guy.
THANK YOU.