Build Mobile Apps that Stand Out (Here's the Playbook)

0:00There are a bunch of mobile apps making 10k a month, 50k a month, 100k a month. And I've noticed that there's something in common with all of them. They stand out. So today's episode is a free course. Yes, it's free. And today we're going to teach you about animation, interactions, illustrations, iconography, widgets, and how you can come up with ideas to make a mobile app that is well designed, that is going to stand out, that is scroll stopping so that your mobile app has the highest probability of success. Today's episode is with Chris. He's a single developer and he runs a portfolio of cash flowing mobile apps.

0:452026 is going to be a massive year for coming up with vibe coded mobile apps. I want to see you build one that works.

1:01Chris Farroki, he's back on the pod. It's been too long. Chris, by the end of the episode, what are people going to get out of it? First, thanks for having me, Greg. I think the main thing I want them to get out is how to make apps that stand out. Because right now, it's never been easier to make an app. There's hundreds of apps coming out every single day. And I want to teach people how to make something that stands out from the competition. And we're not promising you're going to make 10K a month, 50K a month, 100K a month apps. But we are seeing an increase in the amount of people, solo builders, building these apps that are generating life-changing incomes.

1:39And I think one thing that they have in common is they do stand out in some way. So Chris, can you commit to me that by the end of the episode, you'll give us a few tips that people can take away so that then when they build their own apps, they have a higher chance of success? Yeah, 100%. I can do that. All right, let's get into it. I'll give a really quick intro just so people have context. My name is Chris. I build productivity apps. I document everything on YouTube. I've taught people how to build apps. I've also built a bunch of different apps myself. The reason I'm sharing them is it's not to plug them on the channel or anything.

2:16I just want to show that these are pretty robust apps. One of the common reactions I get from people when they see the apps is they're like, there's no way a solo developer built these things. It has to be a team behind them. And I wanted to show you guys that it is definitely possible, but it is really only possible because of all the AI stuff that's happened. There is no physical way that a single person can develop and launch these and maintain them and keep growing them without the help of AI. So I just wanted to share this so you guys know that I do have experience. I think the biggest one right now is Ellie, which is a daily planning app.

2:53There's a couple thousand paid users that are using this. think around somewhere between like 7 ,000 to 10 ,000 daily active that are using this. So it's a pretty substantial app. And then right now my newest app is called Amy, which is a calorie tracking app. And the reason I want to bring this up is there are thousands of calorie tracking apps that are probably coming out every single month. And what's fascinating about this calorie tracking app is it has actually gotten a lot of attention recently. And that's why I've decided to build it. and the reason it's gotten attention is because I have crafted it in a way that it has really stood out among the calorie tracking apps and we're going to go into some of the details of why I believe it stood out and how you can apply it to your own apps and everything I'm about to share even if you don't have a technical background you can 100 % apply every single one of these things with AI, with no coding experience I'm very confident about that it might just take you a little bit extra time to learn and grasp some of the concepts but if you take the time you'll be able to do this stuff too.

3:54Let's go into how I make these apps that stand out. So the first thing, there's a couple of things I'm going to share, but the very first one, which I think is probably one of the most important ones, is animations and interactions. And this is stuff to make the app feel more dynamic because, again, coding has never been easier. Anyone can spin up an app in 24 hours and people are doing that. So that's why there's a flood of these apps. but a lot of them are very static. You can kind of tell that they're AI generated, they're vibe coded. Just like you can tell when an image is an AI image or a video, consumers and users are also starting to spot when something was just a 24 hour vibe coded app.

4:39And so to stand out, and one of the tells of that is, or one of the tells that you can, one of the things that you can see that an app is probably vibe coded is it's very static. It doesn't usually have a lot of life to it. And so a way to combat that is by having more animations and interactions. So I'll show you an example of what I mean by that. Sam Altman, the co-founder of OpenAI, just said that it is the era of the idea guy and he is not wrong. I think that right now is an incredible time to be building a startup. And if you listen to this podcast, chances are you think so too. Now, I think that you can look at trends to basically figure out what are the startup ideas you should be building.

5:19So that's exactly why I built idea browser.com. Every single day, you're going to get a free startup idea in your inbox. And it's all backed by high quality data trends, how we do it. People always ask, we use AI agents to go and search, what are people looking for? And what are they screaming for in terms of products that you should be building? And then we hand it on a, you know, silver platter for you to go check out. we do have a few paid plans that you know take it to the next level give you more ideas give you more ai agents and more almost like a chat gbt for ideas with it but you can start for free ideabrowser.com and if you're listening to this i highly recommend it um so this is my calorie tracking app amy and the way it works is it's kind of like apple notes where you just type what you ate, just like you would in Apple Notes.

6:13And then on the right, an AI is actually going to search and try to calculate the calories for you. And so again, this is a very interesting take on calorie tracking. But when I tweeted out this concept video, it absolutely blew up. There were so many incredible designers who were praising it. I think about 800 people joined a waitlist that I put up just from a single tweet. And that was after like 20 hours. I just forgot to put the waitlist up, like put the link for the waitlist. So even just at the tail end of that tweet, 800 people joined the waitlist, which again is kind of crazy for a calorie tracking app because there are so many calorie tracking apps.

6:52It's like the stereotypical AI app to build right now. But this one did stand out. And I think it was, again, because it was a bit of a novel concept, this pattern of Apple Notes meets calorie tracking, but also it's the animations and just the feel. When people saw this, it really did stand out to them. Now I want to show you a concept that I tweeted the day before of the exact same app. This one had like 1 ,000 plus likes on it, like almost, I think, 300 ,000, 400 ,000 views. This one had like seven likes on it. It's the same exact thing that I tweeted the day before. Same concept. You just type in like Apple Notes, you see the calories on the right, but there just wasn't as much attention to detail and the animations and interactions compared to the first one.

7:38so you can kind of spot the difference here like if we go back to the first one you can see on the right it was a very conscious decision to have it say searching there's that little animation with the gradient the sources come down all of that stuff is available on the right I just didn't take the extra time to do it but here it just says calculating and it kind of shows there is a little bit of an animation where it kind of subtly there's like a little tint as well in the calculating but it's just not as subtle or it's just not as good. But that is the difference between a tweet that went pretty viral from my perspective versus one that didn't, even though it's the same concept.

8:15And the difference between these two screens was about, it was literally 24 hours, like less than 24 hours actually. I think I made the changes in probably six hours. And again, just all vibe coded, not a single line of code was written for this. But I think this is a prime example to show what happens when you go an extra mile with the animations and interactions. Here's another one for my budgeting app, Luna. This is actually, oh, sorry. Real quick on the calorie tracking one. I gotta be honest, Chris, when I saw you tweeted this and I saw that you were going to the calorie tracking space, I was like, don't do it, Chris, no.

8:51You know, having seen so much competition, you have the Cal AI guys doing like$3 million a month and so many people copying it. But then I watched the video and it was just a breath of fresh air, that's what it was and I think that's sort of the lesson I took from this which was even if you have a highly competitive space like hyper competitive, you pick literally the most competitive space if you can figure out a new way from a UI and interaction perspective to showcase that information and allow users to interact with it sometimes it's you know it can go viral tiktok x and that essentially becomes your mvp like you don't even need to like here you were actually building this app but like you could have theoretically just you know created the video posted on x see if people liked it and then when build it built it yeah yeah 100 i think you said it correctly like there's so much competition here.

9:56And this is a really good way to validate it. The funny story is this was actually me validating it. So I didn't even plan on building the app completely. I just kind of posted the concept. This was just me from actually a throwaway project in 24 hours for me to play with Apple's liquid glass. I was kind of testing some things and it just so happened that people really resonated with it where I was like, okay, I guess I actually have to go build it. But yeah, that's exactly what I would do too. If you have concepts, just throw them out. You'll be so surprised. But the The thing that does make these type of things stick out, it is the interactions, the animation, those details.

10:29That's what's sticking out because anyone can code now. Anyone can do it. These details do matter. Do you want to move on to the next one, Greg? The next thing is my budgeting app, Luna. Again, an insanely competitive space. The budget tracking space is so competitive, but people really like the app that I built because I spent a lot of time on the interactions, the feel, just everything. I'll play a short clip of just some of the interactions throughout the app. But if you kind of get a sense that there is some motion here, it does feel a little bit different. I wish I could also convey there's a lot of haptics going on.

11:05So that's when the phone kind of subtly vibrates when you're clicking things. There's some page swipes there. All of this stuff is really minor. And even when you're watching this video, it probably just doesn't look like a lot. You're just probably thinking, oh, this just looks like an app. but I'll show some specific examples of the little details that went into this that I think really did add up and make for a better experience because people could have chosen another budgeting app. There's so many out there but the reason people stick with this one and the things that I'm hearing over and over again from users is this just feels different.

11:38This doesn't feel like a normal budgeting app. So here's an example of the level of detail I'm talking about and it's something that, again, you could totally just vibe code and do yourself. It'll just take a few minutes. So one thing I did was when you look at a lot of normal Apple apps and just default apps, when you transition between pages, usually it's just kind of an instant transition. Like if you're on your contacts app and you click between the pages, it's just going to instantly appear. Something that I wanted to do was add a little bit of motion when you're changing between the pages.

12:07So if you look closely here, you can see that the pages are actually swiping left and right. And it's really subtle. So a lot of users probably won't even notice that this is happening. I'll slow it down here so you can see exactly what I mean but when you transition between the pages there's this little bounce and the pages are kind of shifting over that minor detail was something I saw in another app I don't even remember what the app was but I remember seeing that and I thought to myself why does this just feel different something about this is just so nice and I spent a lot of time trying to figure it out and then I literally had to record my screen and slow it down and I was like oh my god the pages are transitioning that is amazing so this is just one example of something in this budgeting app that I did there's so many other things that I did here that kind of add to create this experience this is the level of detail I'm talking about that I think anyone can do and again the way that I did this was I literally just was dictating into cloud code and I just told it hey can you make it so when we transition between pages have it slide over and then I just had to do a few more prompts to tweak it to tweak the speed, the bounciness but all in plain English This is something you can totally do as long as you know how to describe it.

13:18Another example is dictation. So this is my daily planning app, Ellie. We actually have this AI assistant, and you can actually dictate commands to it. And something that I did was I added a little bit more animation to the dictation. So now when you click this icon, you'll see that the background turns black and kind of expands from the microphone. the icon here actually rotates from the send button to the check mark button it's so small and subtle and it needs to be slowed down to see it but again it's one of those things that when a user sees it and feels it and then compares it against another app they might not know exactly what's happening but they'll be like why does this just feel better and again you do this across a hundred different things in your app it will add up people will remember these things They'll remember the feeling of using your app.

14:12And I think that this is just another example of a small detail. And same thing here. All I did to do this was I just told CloudCode, can you make a black background come from the microphone icon? And can you rotate the send button into the check mark? I think this one was actually done completely in one shot, in one prompt. Like this one, I was actually very surprised that it got it. But it's because CloudCode, for example, is very well trained at interactions and animations, which might surprise a lot of people. It is very, very good at this stuff. Apple has a great animation library that's very well documented.

14:47And so it can actually do these custom animations if you know how to describe it. I think, going back to that one, I think you're totally right in the animation. It's smooth and it's fresh. But I also think there's a few other reasons why this whole concept resonated with people. One is you created a mascot, which we're seeing that as a huge trend right now, which is like, especially with AI first apps, like people see it as like an animal, a person, you know, someone they're talking to. So having that, you know, I think helped one. Two, it's voice first. It's a voice first app. And I think that there's a huge opportunity to look at.

15:33I'm sure there's a ton of planning my day apps, but how many of them are legitimately voice first? I don't know. So I think you did that well. Third is you didn't just have a text box that said ask anything. You had contextual buttons to get people to actually engage. What's next? Plan my day, et cetera, et cetera. And I think that's important because when users are looking at a blank screen, they don't know what to do. There's a reason why Google has the I'm feeling lucky button on Google search, right? It's because they know that sometimes people show up to Google or whatever and they just don't know what to type in.

16:15Yeah, 100%. I think that's something that if you're, especially someone who's kind of just vibe coding for the first time or making an app, it's one of those things that's really probably overlooked. They probably would not put the chips here or understand the significance of this. but yes, a lot of thought went into putting these chips here when I coded this. A lot of thought even went into what specifically should I put in here. So I did study a ton of ChatGPT, Claude. I studied all of these apps to figure out what are they doing, why are they doing it. But yes, these details, it does actually, not even for the feeling, it has a direct impact on the usage.

16:53People will probably click these things and there's just a higher chance that they'll use it more properly if you have this. Anything else on this one, Greg? We're good. Cool. I'm glad you actually brought up the mascots and the illustration because that is going to be the next thing we're going to talk about to make it really feel like a more premium and just a different app. Two more examples on the animations interactions. In the calorie tracking app that I'm building, another thing that I added was the streaks feature. This is where you can build a habit. But gamification exists in Duolingo, even in Snapchat, in a lot of different apps.

17:32Gamification is a very powerful way to build habits and increase retention. I decided to actually add a streaks feature here. And then for fun, a little badge that you can actually unlock as you start increasing your streak. And these were hand-drawn by my fiance, so very fortunate. But I'll also show you how to make mascots like this using AI, because that's what I was doing originally. but something that I coded which a lot of people were surprised that I didn't write a single line of code for this was when you unlock the badge you can actually click it and they're based off of cat memes but you can actually drag along it's like a holographic sticker type thing it's kind of based off of Pokemon or just these holographic stickers that you can unlock there this was completely done by Cloud Code as well and all I did was tell it can you recreate a kind of holographic sticker where I can move my finger around and I can drag along the sticker.

18:29And I was so surprised that it was able to get this in I think two prompts. Again, because Claude is very well trained on Apple's technology. This was using something called Swift Metal, but it is very well trained on this. So it can make these really cool interactions, but I just don't see a lot of people doing it, which surprises me because I think people assume that it can't get it because this stuff does look very complex. But if you know how to say it, if you know how to break it down in plain English, it is able to get these things. So this was another really cool example that I think stood out to a lot of people.

19:01Last one I'll show on the animations interactions is actually one that was created. I was not using Cloud Code or Cursor for this. There's another platform called Anything. So it's I think createanything.com. I wanted to show that even if you're not using a tool like Cloud Code, you can do this in stuff like Anything and lovable and be zero if you know how to prompt it correctly. So this was just a fun 24-hour concept that I made. It was another food tracking app purely built with createanything.com. And I added a bunch of custom interactions and animations here. So here's one that appears. This date picker that appears, that bounce, that modal, completely custom.

19:42This little sheet that says take photo, gallery, enter text, these are not components that Create Anything has. these are fully made by the AI and the animation of it popping up and kind of having a little bounce and a shadow that was fully custom that was something I completely told it to do and that was me trying to push it and see what it's capable of another thing very subtle is I have this mascot of my dog Luna looking at these foods it's very subtle but you can actually see that it's bouncing up and down a little bit so that's another very subtle animation I was testing but it doesn't matter what platform you're using you can do this in all the other platforms but the important part is just understanding how to break this down in plain English, that's the important part but I'm pretty sure all of the platforms are capable of doing stuff like this so that's the animations and interactions this is probably the number one thing that makes AppStands out and again if you're going to record demos or concepts that is what shines in these demos and concepts the difference between this tweet blowing up and this one not is just, do you add a little bit more polish?

20:48Is it a little bit more dynamic? To go on to the next thing that really makes apps stand out, it is, as you mentioned, Greg, illustrations, mascots. This is something I started doing in my apps because of AI, because I'm able to generate these things. And we actually talked about it in the other episode that we recorded before. And I have a whole video on my channel documenting how I build these things. But right now, what I'm using primarily is ChatGPT. I've noticed for some reason it's very good at making these kind of illustrations. And I think with the newest models, with I think Chachapiti 5, once it started with that, it got really good at following instructions for mascots.

21:25But my pro tip, if you want to make mascots, and here, for example, is this AI meeting assistant app that I was working on, and it had this mascot that people just absolutely loved named Lily the Ghost. And what's cool about having mascots and using AI, you can make almost infinite generations and iterations on the same mascot. So here I took Lily the ghost and I made a variation where she has a magnifying glass and she's searching. So you can kind of see how in your app, even in empty states, so this is like a state where typically there's nothing going on. It just, it probably for most user or for most developers, they would probably just put a looking glass icon or something and it would just say, type something to search or no results found.

22:07This is a great place to put custom illustrations to really give your app a lot more personality. So that's what I did here. And I just generated this in GPT-5. But my pro tip for anyone who's doing this is actually to bring on or hire an actual artist to generate the first version or some sort of concept and then use that and feed it into ChatGPT or whatever you're using to generate as a reference and say, hey, can you kind of riff off of this style? and that's actually what I did to generate Lily the ghost. I didn't just directly say, can you make a ghost mascot with a flower on her head? I didn't do that.

22:46Instead, what I did was I fed in this. This was a hand-drawn illustration that my fiance did of our dog Luna and I told it, okay, can you use this as a reference and now make me a ghost based off of this? It didn't actually follow the illustration style that closely, but I did notice that there were some elements that kind of was retained. Like some of the shadow is kind of very similar. but that is something that that's a little trick that I've learned is just if you pay someone for some original art there's a high chance that the iterations that you get will just be a lot more unique because everyone is doing this right now I'm now seeing a lot of people using AI for illustrations this is now becoming a more common theme so to stand out you will have to either be really creative with how you're generating these or again, I would recommend commissioning an artist, getting some sort of first version done because then at least you know it is unique.

23:38It's actually cheaper than a lot of people would think. I think you can probably get an artist to do a very first version for you for $200,$300 or something. Then obviously, once you have the actual mascot, you can make infinite iterations just like I did. Oh yeah, sorry, go ahead. Can we try something? I know this is sort of off script. Yeah, yeah, yeah. Can we go to chat GPT and if we give it a reference image of say the Snapchat ghost. You know the logo, the Snapchat ghost logo? I wonder if let's just say we want to create a actually maybe with the tongue sticking out because there's a little more personality.

24:25I always found this was pretty decent in terms of the brand. Let's just say we're developing an app and you know we're inspired by this we want this sort of vibe but we want more of like a 3D you know kind of like how you had it like yours it feels well is yours 3D would you say it's 3D it does have some shadow so it's definitely not like fully 2D I think it was a little closer it has some depth so maybe we say like we like this snap logo in terms of like it's youthful fun fresh energy

25:07but I want to do like maybe a banana as a mascot let's say you know I'm creating a mobile app and I think a banana for whatever reason is interesting and I wonder yeah I wonder just how you would prompt it to get the most out of it I think what I would do is I would say can you create just follow the same vibe as the original image yeah and let's just see what it does here um typically i do have to do this a few times so i think to get the ghost mascot i think it took maybe like 10 to 15 different prompts and i think i had to tell it things like can you make it less cartoonish can you make it more cartoonish can you remove these elements so we'll see what this comes up with i have no i've never actually tried 5.1 this is i think new as of this week so yeah i'm kind of curious how good it is um it might surprise people but i've found also that for coming up with novel mascots chat gpt is actually better than gemini better than nano banana from google um i think nano banana is very good if you want to make iteration so when you have the base mascot but i am still finding myself making actual mascots like the first version in chat gpt okay let's see what it does here and then let's see what it copies i also another pro tip when you're using chat gpt for image generation the more you ask of it the harder or the worse it usually gets so it starts deviating and then you start getting that kind of chat GPT style that you see in a lot of chat GPT images if you ask it to just do one thing really well it's way better at following instructions so okay let's see it did come up with a banana I think it did kind of it did keep some of the shadowing that's here for sure it kept the tongue it actually kept also really the same style as the eyes even the lines are pretty similar.

27:02So I think it did a good job of keeping the style because this is what we gave it. So it does seem like it's kind of similar. But yeah, I mean, we could keep riffing off of it. There's so many things you can keep riffing off of it. Like if I say... Let's do one more. Yeah, what do you want? Let's do one more prompt and see what happens. I also like, I kind of feel weird that we gave it like the Snapchat image with their brand and likeness, but it was a place to start. So what would you do to make it like different but also unique and better. I think what I would do, again, my advice is if you can use original art somehow, or a combination.

27:41Actually, let's just see what happens here. I have no idea what it's going to do if I do this. If I feed in both this hand-drawn illustration of my dog and the Snapchat mascot, both the ghost and dog mascots,

28:03I've noticed also when you do combinations you get very interesting results I literally have no idea what it's going to do here but it'll be cool to see because we at least know what's going to happen if we just did the ghost let's see what happens if we do both but this is actually a way to because I think something that I'm really worried about when I made a video explaining how I do this stuff I explicitly was like do not try to copy someone's style one for one you need to be original here so definitely if you're going to do it make sure you just iterate a ton so it looks very different or again use original art or mash like three or four things and get the elements that you like from it to get something unique that's probably what I would do because I know that if someone's going to do this the first thing they're going to do is just probably throw in the Duolingo owl or some logo that they really like oh my god what is this

28:53it's very different okay I see that it's more 3D already it looks like a lot more you can tell it has a lot more depth it's probably because it now has two references of something with a little bit more depth this has some more shadows here wow that is insane and it kept the bow so now it has the tongue and it has the bow from my dog that looks insane Greg if you use this I think I think you might get sued or something this looks like yeah but it that's interesting oh this is not no this is not it um oh no here we go here was the comment banana you know on youtube if you like this logo yeah yeah if anyone wants to use this as their logo please feel free you have my blessing to do this but it is interesting to see the difference here when you feed in one versus two.