Week 5 (April 28 - May 14): Shifting to Firebase

From AWS to Firebase!

Earlier this week, while I was browsing forums on Reddit about designing database’s for mobile apps, I noticed a general sentiment among commenters that Google’s ‘Firebase’ service was easier to use and favored compared to AWS for phone applications. Because of this, along with the fact that I hadn’t stored too many items in my AWS database yet, I’m deciding to shift to leveraging Firebase instead.

UI Help

Before I could start coding, I need to figure out how I want my app to look. Particularly I want to establish the design choices of my onboarding screens, as I feel I can base the rest of the app’s look and feel on this blueprint.

With some funny timing, one of my old eSport teammates and good friend ‘Coby’ reached out to me seeking help to build is UI portfolio. He was now working as a UI/UX designer and was wondering if I had any projects he could help on, or connections I knew that could help him. Conveniently I am just now needing some UI design, so I hopped in a call with him to figure out where to start!

I explained my vision for the onboarding process: the user would be able to pick images of various interior design styles, and depending on the styles they choose, my app will evaluate their ‘favorite’ style. After working with him for hours and tweaking his initial ideas together, we designed the following 13 screens for our UI:

Swotting Firebase

The main reason I wanted to connect the database to the application is so in the future I can add as many design concept images to the ‘select your styles’ screen. As in I can simply import images to the Firebase database whenever I want to add more images.

By watching ‘CodeWithChris’ on YouTube, I’ve figured out out how to connect Firebase to a screen on the mobile app to include this feature that I wanted to add. CodeWithChris has been a great resource I’ve been using to learn about Firebase as he has made a playlist of videos dedicated to learning Firebase as a beginner, including setting up Firebase using Xcode, as well as reading and writing data to Firebase.

CodeWithChris’ playlist for Firebase beginners I used to study the database service

The main problem for me has been finding the right tutorial to watch and learning the terms relating to Firebase. Some tutorials directly were not related to what my need was, but I only figured that out after I watched the majority of it or once I tried it.

Coding at Last

Now that I’ve worked on Firebase for a week and figured out how to read and write data, I’m finally ready to start developing the the first couple onboarding screens for the user. To keep it simple, I’m focusing on developing with Apple first before Android since it is the more popular platform for mobile users. This involves coding utilizing Xcode as well as Flutter, a development software popular for building mobile apps.

Trying my best to stick to the UI design that Coby and I designed, I was able to develop the first several screens, including the introduction, log in, and sign up screens:

My introduction, login, and sign up screens built around my UI design

Next Steps

Now that I’ve began some development of my app, soon I want to start looking into how I can train an AI to generate images of interior design floor plans. I’m excited to get started since this is such a key component of my apps functionality!