Usemoji.app - Convert text to emoji with AI

Web%87 ready
Last update: 27 Mar, 2024

Here is we are here! It's my first #sideproject and I've been sharing the entire process with #buildinpublic.

I'm building a product that helps you find the appropriate emoji according to your write by AI. I'm using GPT-3 for this project. If you want to follow the entire process you can follow me on Twitter

What is Usemoji.app?

As we all know, emojis have become an integrat part of how we communicate in today's digital age. They add a whole new layer of emojiton and context to our messages. And that's where usemoji.app steps in - select your text and find the emoji that fits your lines in seconds. It helps you elevate your texts and increase engagement.

I'm still developing the product right now. So go to usemoji.app and subscribe to the newsletter to be notified when it's ready.

Tech Stack

  • Next.js for Web.
  • Shadcn/ui for UI library and Tailwind for styling.
  • Supabase for database.
  • Vercel for deploy.
  • Mailerlite for email marketing.

The first version will be basic and minimal. I will add new features in the future. Just install, click and use it, that's all!

The Process

1- I design a logo for the product. I'm not a designer but I'm trying to do my best. I use Figma. While I design the logo, in my mind I have emoji colors and AI symbols. I think I did a good job. What do you think?

2- I'll work with AI first time. So that's why I need to read some documentation about openAI and watch some videos. When everything is okay on my side, I created an api key and try to made some example.

3- Actually I have a few feature about the product. But as I said I want to launch as a MVP because I don't have time so much to finish it. If users wants to use and new features then I'll improve it.

4- Firstly I will launch an extension on google chrome. It was easy to build to me.

5- I thought it will be good if I prepare a waitlist page on website. I'm sharing about the product on my twitter account and I want to collect emails. Because It can be hard to reach some users for this product and I don't want to lose them. That's why I guess coolect eamil will be a good idea.

I didn't have a hard time unless try to ready an image for project :)

6- I created profiles and some articles on ProductHunt, Reddit, HackerNews to pre-launch.

Also I'm thinking to beta test with a few people on waiting list. I'll send them an email and ask them to try the product. I'll collect feedbacks and improve the product.

7- Here are some numbers. I only announced it once on Twitter and these are the statistics after that.

  • 291 visitors
  • 55 subscriber
  • 54 countries

8- Actually I'm planing MVP version and that's why I want to keep it simple the user flow. I've a few path for it but need to decide which one is better both in terms of user experience and development logic. That's why just 2-3 inputs, 2 buttons, 1 settings menu, 3 tab bar and that's all. If you are new user in this application you will not hard to use it.

9- Next.js is really a very fast developing update. While I build usemoji they are publish new version and i decided to update my next.js version. I take some time to update it but it's okay. Because i learnt a lot of think for version 14. Also I have to prepare some design for product. I don't like this steps but what I can do it... I have to it...

I added a new feature that is context menu. Actually I've been thinking the context menu will be quick way to recive emoji text. Probably I'll often use it. I hope you will like it :)

10- Totally finished extension main page. It takes time a lot but It's okay because I don't have any design file. Sometimes I like to develop something without design, in these time I feel a lot more inspiration coming. Here is a screenshot on extension page.

11- During this time, I have dealt with many bug fixes. Well, if you are a developer, this becomes a part of your life :)

12- I had some basic problems. I'm running next.js app as an iframe in Chrome extension. At this point, sending data from the extension to the next.js app was not working very well. I solved it successfully and it's working nicely now.

13- If you have a product you should have settings page for account, payment, email marketing... I hate to build these pages. Probably if I need to build a product I will use this design and logic again on the future project.

I tried to keep simple all logic on the settings page. Because I feel it will be unnecessary if I add more logic and increase to complexity

14- I updated homepage design again. Because from now on, we can start accepting users for the beta version. Only the AI part remains. But I can still start developing the homepage. That's why I prepared some visuals and content.

I have prepared an open source project for homepage design that everyone can use, and you can access it from my github account. github/waitlist-landing-page

15- To determine the price of the application, I opened a poll on Twitter and set it at $4. Thus, it will be an amount that anyone who wants can use it.

I also prepared a gif that I liked. I want to share it here too :)

Keep in touch. Story will continue...