Sunday, 13 June 2021

Creating Figma Comments

June 13, 2021 • Posted in


What was project about

A mobile app for iOS and Android to continue with your comment conversation on Figma. You can subscribe to updates to a bunch of files and get instant access to the conversation on the phone.

Further plan included creating a Slack App, Viewing full canvas and file browser – all via your mobile phone.

I stopped this project when Figma announced their Slack App which was in fact the same thing what I was planning to build.

How was the project developed

Backend: Firebase with Node.js
Website: React with customised Material UI
App: React Native with a focus on using native navigation patterns

What I gained

  1. Launching a product on my own is the biggest achievement. I had never done that before, and doing that last 5% of work to put something out there was new to me. I feel this unlocked something inside me and removed the hesitation of launching another side project.
  2. Although I have development background, this project needed me think of both short term-MVP launch and a longer term second version too. Next to that, I had to plan out my work as if it's another job - brushing up my management skill. And lastly, I wanted to design things that were relatable to Figma but still easy to use.
  3. I also gained a lot of confidence in working with all three pillars of development - backend, website and apps. Apart from minor changes (Next.js instead of React), I might stick to this stack for my next projects too.
  4. During all of this, I was taking help from my partner, Indhuja, for not only design but also on how to structure the development topics like database, API structures and how could I iterate in the future. Since both of us are Product Designers first, this also helped us discuss the nuances of structuring databases and API.

What I learned

  1. Don't settle for a smaller concept. Release something which is actually useful. I feel I should have gone with the Slack App first. This question came up again and again, Figma is work but my phone is personal, why would I install this app. I ignored it and went ahead just to learn this technology (or rather stay in my comfort zone).
  2. Give your side project respect, but don't overdo it. I felt when I was reaching the release time of the project, I got too engrossed into the project and stopped treating it as a side-project.
    More backstory
    1. In Oct 2020, I wanted to learn SwiftUI to see if it can help me in rapid prototyping for doing user research on my day to day design work. I picked this project because I imagined it to being built with simple list views and detail views
    2. Soon, after realising that this would need a backend and website, I went ahead with React so that I can learn one paradigm and apply it for both the website and the apps. Plus I needed to build for Android too, so SwiftUI wouldn't have helped.
    3. Also, I was also familiar with React Native a bit. At Urban Sports Club, we revamped the app in React Native and being a curious person, I used to debug UI issues with dev through code.
    4. Firebase was another easy choice as I needed multiple services like authentication, storage, database and push notification.

 

Figma comments, now on your phone!