Hey everyone —
I’m Toon and I’m a freelance product engineer and side project aficionado.
I’m currently in the process of designing, building, and launching two new products in Q1 - 6 weeks per product.
These last 5 weeks I’ve been building Dime. Dime is the easiest, fastest way for freelancers to create professional-looking invoices.
I’m building Dime in public, and this is my weekly update on what I’ve been working on.
So far, I’ve published two editions of this newsletter every two weeks. This week I wanted to try something different and post a weekly recap.
Let’s dive in!
Week #5 Recap
This week was all about polishing the app ✨
![Twitter avatar for @tonnusos](https://substackcdn.com/image/twitter_name/w_96/tonnusos.jpg)
![Image](https://substackcdn.com/video/upload/e_loop,vs_40/b9fvwkqkhayfviem8grk.gif)
Even though Dime is very much an MVP, I think it’s important to differentiate between an MVP and a prototype.
In my opinion, an MVP should do one thing really well, not many things badly.
That’s why this version of Dime is just about creating the invoice and making that feel really great to use. It’s the reason I didn’t add a login screen, account management, or even a database.
Though I had grand plans for polishing, unfortunately, this week had other plans in store. I had a lot of personal stuff going on and I didn’t quite get around to working as much as I wanted. Only by Friday I finally managed to sit down and do some work.
![Twitter avatar for @tonnusos](https://substackcdn.com/image/twitter_name/w_96/tonnusos.jpg)
![Image](https://substackcdn.com/video/upload/e_loop,vs_40/cvi4lpudh6v5e4iecqbs.gif)
Animating React components with Framer Motion
I think animations can really make an app feel finished and “crafted”. In previous MVPs I built I never bothered to add animations, so this time I wanted to do things differently.
Since the app is built with React, I picked up the most popular animation library in town: Framer motion.
Here’s what I ended up doing:
Added fade-in animations for each section of the landing page. When a new section reaches 50% in the viewport, it fades in.
Added a transition animation between each step of the flow. The content slides in from the right. I did this to help the user understand they’re going through multiple steps. Kind of how Typeform fades in steps from the bottom.
Added various timed animations to the last step, where the user gets to download their invoice. I wanted this step in particular to feel delightful and fun. It starts with a blank screen, and then the invoice preview slides in from the bottom. It settles into position and then the shadow appears and expands. Then the heading text appears and it finishes by fading in the download button half a second later.
Check out the GIF in the tweet or - even better!- create an invoice on getdime.co to see how it turned out!
There’s still lots more tweaking to do though, but unfortunately, my week was cut short so that’ll have to do for now. I really enjoyed this process though and learned a lot. 💯
A new idea?
While working on Dime this week, I had three different new ideas for products form in my head.
![Twitter avatar for @tonnusos](https://substackcdn.com/image/twitter_name/w_96/tonnusos.jpg)
![Twitter avatar for @Julian](https://substackcdn.com/image/twitter_name/w_40/Julian.jpg)
New ideas pose a conundrum: are they an opportunity or a distraction?
I have no idea (pun intended).
But since I like building things and having fun, and since all I have is a gut feeling, I’m going to give this new idea a try.
So what is it? I’m calling it Freelance Developer Jobs, and I hope it’s fairly obvious what it is: I want to connect available freelance engineers with companies.
I’m thinking of eventually positioning it as a job board for freelancers, but I’m starting with a newsletter to make it feel more exclusive.
First I’ll need to validate the demand side: do freelance engineers want access to vetted gigs? “Vetted”, meaning: a 30-minute screening call done for you, by another developer, to discuss scope and budget.
To validate, I built a landing page in about 5 minutes with carrd.co. Sidenote: I love carrd for exactly this reason: the ability to spin up a decent landing page in an insanely small amount of time.
👉 Here’s the link to the landing page: freelancedeveloperjobs.com.
Next, I just need to start talking to a couple of freelance engineers. But this wraps up week #5!
Goals for this week
This week is week #6, which means it’s the last week I’m actively building Dime.
My goal from now on will be to validate the product (will people use my solution?), which means getting as many eyes on it as possible.
I’m going to spend my time posting the Dime link anywhere I can. I’ll probably do a Linkedin post as I haven’t told my professional network I’m working on this yet.
Some initiatives I’m planning:
Post to alternativeto.net
Create comparison pages on the marketing site
Run a twitter/reddit ad campaign
Post to various startup indexes (betalist, etc)
Post to some reddit communities
Reach out to some developers to interview them for Dime Starter Stories
Validate freelancedeveloperjobs.com by getting at least 50 signups.
That’s it for now, I’ll be back with another edition end of this week.
Thanks for reading,
Toon