Introduction

String Me was a freelance project in partnership with a client I'd worked with previously, it was supposed to be a racket string service based in Dubai for picking up rackets from customers, getting them re-strung, and delivered back to the customer. Unfortunately, the idea never took off but it was an extremely valuable experience for me personally. I developed this application on Android and used it as a springboard into Kotlin, in addition I made a landing site to the app pages. I learned about the full stack development experience on Android, right from designing assets in Sketch, adding data on Firebase, to launching the application on the Play Store.

Goals

My primary goal for this project was to learn the whole process of Android development, get an introduction to Kotlin and to provide online customer support after the initial application which never came to be 😆.

I was fortunate enough to be introduced to some new things during building this project too, namely animations in Android (limited to button clicks as I had custom button assets) and a coupon system which would apply discounts in real-time when the user was checking out.

Process

If this is too much to read, here's a summary of the technologies this site is using:

• Android
• Kotlin
• Google Maps API
• Firebase: Cloud Firestore, Cloud Functions
• Material Design
• Sketch
  Given this wasn't gonna be huge project, it made sense for me to use Firebase and understand all the different functionalities it offered. It more than sufficed, and I also made it so that the back-end was entirely scalable if the project did take off with a relatively simple database design that didn't involve too many moving parts. The moving parts would be user accounts in the future and perhaps implementation of a payment gateway so customers could pay online (there's a big cash-on-delivery trend in Dubai).

I started off by designing mockups on paper then moving onto Android Studio and building out each page, which invariably involved me leaving Android Studio and moving to Sketch to create custom assets.

Design

While I was decided on using Material Design, I definitely found the default templates on Material Design a bit bland (this is late 2017 - early 2018, it's not the case anymore) and so I decided to spice it up. Most of the structure was still there but I stuck to a more flat color scheme reflecting racket sports (green and white). One thing which I used were Material Cards with a pretty modern design of rounded edges that have taken off since.

I designed all the assets in Sketch myself, downloading some free from the web and customizing them how I saw fit, and there were some assets that I designed myself too. Sketch was my tool of choice since it's made it really easy for me to learn design, I always found Adobe's tools a little complicated but through Sketch I've been able to gain a certain level of competence across the board. While I wouldn't advocate my design in production, it's no-nonsense and effective in sending whatever message is trying to be delivered.

Functionality

This project was primarily exciting for me because I'd be deep diving into Kotlin. Since I didn't have too much time to learn the concepts of Kotlin, I just learnt as I went through the development of the application. Even as early as I built this application, there was documentation and Stack Overflow posts available for me to find my way. While hacky, Google's Java to Kotlin feature was also really nice. I used it as a way to learn, though, I'd see the code converted and then go through it and then also try to find the best practices for implementing in Kotlin. That made the process of development much easier and enjoyable, and it also opened up the peculiarities of Kotlin that showed its advantages over Java.

Firebase was super easy to learn and use, I decided to use the newly released Cloud Firestore and that served as an introduction for me to NoSQL. Additionally, what I really enjoyed using was Cloud Functions because this was my first introduction to Node.js. I implemented a trigger for customers and the admin team being emailed whenever a new order was placed. Seeing this work for the first time was mind-blowing for me, I think mostly because of how seamless it was to set up.

I also used the Google Maps API for the customer's location so that it'd be easy to get to them (the address system in Dubai is not as structured as here) although specific fields for details were available. I used this geolocation to create a URL that would help the admin team open up the location on the browser. This was my first foray into the Google Maps API and using it for more than just having the map showing up on a screen. It was a bit of a learning curve to understand it but I was super excited to see it working on the application.

I ended up implementing a coupon system at the last moment and it was a neat trick, it worked super well in the end. I made a new collection on Firestore for coupons and the discount they'd provide. The user would input the value in the app and it would immediately search to see if it existed on the database and (in)validate on the app.

Conclusion

This project was a great introduction to Kotlin on Android, it was also my first fully fledged application on the platform outside the classroom. I realized through this application how valuable project-based learning is. I've developed subsequent applications on Android but they haven't involved Kotlin so I'll try to address that this summer.