The Design Process Behind This $18K/Month App

0:00In 2026, when everybody can build apps, the question is, how do you build something that actually stands out in the App Store? I think one way to stand out is with your app design. But, how do you design and build something that actually looks good? Well, I want you to meet Ryan and his girlfriend Sarah. They created an app that makes about $18,000 a month, and one of the reasons it's

0:19successful is because of how it looks. It's beautiful, it looks handcrafted, and it doesn't look like AI slop. But, what I wanted to know is, how do they do it? What's their design process? How did they come up with the idea? How did they craft it? And ultimately, how did they build it into a mobile app that actually works? Well, that's exactly what we're going to do in this episode today. If you're building apps and want to figure out how to take your design to the next

0:41level, this is the episode for you. Let's get into it. Welcome to Starter Story Build. All right, Ryan and Sarah, excited to have you on Starter Story Build. Can you share with us who you are, what you guys have built, and a little bit about your story? Hi, I'm Ryan. Hi, I'm Sarah. We built a simple Pomodoro Timer app called Cat on Chair, that made over 18k

1:05a month. Awesome. For those of you watching, I would definitely recommend you go check out Ryan's video on our main Starter Story channel. Don't do that now, wait till after this video, but you can check that out and really understand why we're doing this video today. In the main channel video, Ryan, one of the things that really stood out in that video was

1:21just how beautiful your app is designed. And we got a lot of questions in the comments around, how can I do that? How can I design an app that looks as good as what Ryan and Sarah created? So, that's what we're going to be covering in this video today. If someone's watching, what are they going to get if they stick around till the end of this

1:37episode? I'm hoping to show everyone how we can combine ideas together to make something simple but unique. All right, well, let's dive into it. So, let's start with just kind of a quick overview first. Give us kind of the lay of the land. What are we going to talk about today at a high level? What are the different steps we're going to get into? And then, we can dive into each

1:57specific step. So, we are going to build a new productivity app that in series with cat on. So, it will be cat themed with some fun twist to a common productivity app. We'll go over how we came up with the idea and how Sarah implemented the animation for the app and how I build it

2:16with AI. Awesome. Super excited to do this. Let's get into it. What is step one in your design and app building process? So, for us, our idea usually came from how we interact with our cats. And we really want to bring the physical experience into a virtual product. So, it will make the app feel more fun and more connected to the users. Sarah can

2:40talk about how we came up with the idea. So, the idea actually came to me a while ago because I love to write down ideas on my memo pad or the notes app on my phone, but I end up forgetting what exactly I wrote cuz I wrote too many. It really not that different from just crumpling the idea into paper balls and throw them in the trash. But, my cat would take them back out. So, I'm thinking, why don't we build an app

3:06around that? Cool. So, before we get into step two, just to kind of like summarize that a little bit. You have a problem in the world and you forget your notes or what happens to them. You have this sort of idea in mind already because of your previous app, but also because it's just something you really enjoy. Cats that you love and you're trying to combine these two into how can we make this into like an app? And so, I really like that really simple approach to finding an idea. Okay, let's get into step two. You

3:30have this idea, what do we do next? Before I draw, I usually search for some cat videos on social media to get some idea of what cats do in real life. But, for this animation, it's quite simple. It just come from a paper into a paper ball. So, I'm just like trying to do it myself so I can understand [music] how the paper turn into a paper ball. So, I usually draw the first and last frames so I can add frames in between to make the animation smoother. So, I done in the flipbook mode in Procreate Dreams and it's 12 frames per second. Procreate Dreams is an iPad app. Yeah, just a

4:11simple animation app and I'm using the keyframe [music] to adjust the position of the jar and the paper ball. So, the paper ball comes [music] down first and the jar moves up and with the paper ball. [music] And after that, I want to have a little paw to appear and close the lid of the jar. So, I'm just

4:35adding a little paw here. [laughter] Nice. And [music] here when the paw close the lid, so there will be a little twist and [music] push down. So, I just kind of change the movement of the lid and the paw so you can see it like the paw is actually closing the lid. [music] So, after I done the rough animation, I kind of add color to it. So, it's like the little paws is going to be black and the

5:03jar will be a bluish green. And yeah, and I also add some color to the paper and that'll be the whole animation. Here. I love it. That's awesome. How long did this take you to do? The whole animation takes me about 30 minutes to an hour. I cannot really remember. Sure. So, well, you know, let's just call it 30 minutes to an hour. And then just so for someone watching who's like maybe they're going to get into this or want to download Procreate and start animating. How long do you think it would take like a regular old person who's never done this to create something like this? Just like what do

5:37you estimate? Oh, actually it's Procreate Dreams. [music] It's different from the Procreate. Procreate is the drawing app and Procreate Dreams mainly on the animation side. So, it really depends if the person have the skill with iPad drawing or not. So, I should say probably a day would be enough. Okay, before we continue, I wanted to pop in and say how awesome I think this whole process is. Ryan and Sarah have figured out how to build something that actually looks good and stands out in the App Store. But, what I really love about all this, both their original app idea and this one that we're talking about today, is how simple it is. Their

6:13first app, Can't Unchair, is just a timer app. And this idea is just like another notes app. We have hundreds of examples just like this across our channels, and it's proof to me that simple ideas always win. So, you're probably sitting here wondering, "How can I find my own simple app idea?" Well, lucky for you, we put together a free database of apps so simple you won't believe they're making money. It's full of insights and data behind some of the simplest apps we've ever covered on Starter Story. You can grab it 100% for free at the link in the description, and then you can start building your own

6:42simple app. All right, let's get back to the episode. Just to recap here quick, you thought of the idea in step one, you animated it here in step two and kind of walked a little bit through how you do that. What do you do next? How do you start to take this from something you have in Procreate Dreams into something

6:58that is lives in a mobile app? Yeah, so after I've done the [music] animation, I export it into frames as image. So, I will have different PNG files for each frame, and then I send it to Ryan, and [music] Ryan will do the rest of it. Step three, build it with code acts. The files I got are just images of each frame. I have to ask AI to [music] transform them into a video file, so it will be much smaller than play PNGs on iOS app. And also, for this animation, I expect it different because there are uh different layers. We have jar back layer, jar front layer, paper ball. I

7:41will show it later like why it's important, but mainly it's just because easier to have AI manipulate each layer and we can layer stuff on top of each other, so it would be easier to do rather than have to just have one video for the whole animation. I see. Okay, that makes more sense now. So, Sarah exported all these as individual frames that when combined

8:06make the animation. Yeah, right? Okay. So, right now I'm using a app called Orca to help me like manage different projects and different AI sessions. It's been easier and I'm just using the default terminal. But here I'm using Codex. The reason being Codex is really more generous with our token, so it's more token efficient. So, here I will just basically telling AI to create our app with UI Kit Swift and just kind of go over what this one feature does. It is probably writing down things they want to do and I will talk about how the animation works. Can just reference [music] it from the animation Sarah sent

8:52to me. And for this I usually want to make sure AI compress PNGs before combine into MOV just so it keeps the files as small and still have relatively good quality and yeah, I will just have it do the same. So, you have this kind of master prompt that's basically saying, "Hey, I have I want to make this app. Here's the idea

9:17for the app. Here's all my animations. Let's start making it." Is that kind of a good summary of it? Yes, that's all. I missed one prompt here is the animation is 12 FPS. That's an important detail, otherwise AI might just default to 24 FPS then the animation will look too fast. So, for this demo I can just start with something simple, prompt like that, but for some more complex features or bigger project, you really can't work through with AI a bit more, like have AI interview me what this app does, what's a user flow should be. Here is it's just

9:53self-explanatory simple prompt. Yeah, for sure. Yeah, so like if you were building something more complex or like full version of your app like cat on chair, you would have a lot more files, a lot more animations, like you said, the back end, things like that. So, yeah, I totally [music] get that. All right, while we're waiting for this to finish building, Ryan, I just have a few questions for you. You know, for someone who wants to do this, what are some like tips or tricks that you would definitely keep in mind as they go from, you know, a design to trying to build it

10:24with Codex or Cloud Code? I think it's quite important to know exactly the end goal you want because if you can't really clear describe it on Codex or Cloud Code, it will just make something up that's kind of close to what you want. And that's part of a process as well. Like for this app, I don't really do UI design beforehand. I can just go in and talk with AI about how the UI should looks like. So, there will be a lot hand-holding or back and forth, but that's just kind of my

10:54process. We're skipping ahead a little bit because what Ryan was doing basically was going back and forth with Codex, making sure it had the right animation, the right way that he wanted to look. And here is the outcome. So, Ryan, maybe just show us or talk through a little bit of what it is that you created here. So, for the first prompt I gave to Codex, we were mainly just writing the notes flow. So, basically people will write down the notes and click save,

11:21then it will play the animation. So, that's the first prompt I gave to Codex. Now, obviously this is not going to turn into a app itself. We need other things like where people see all the notes, and just draw all the notes. So, we kind of came up with the idea to have a shelf of jar. So, each jar can be a different categories of notes, and people can add a new category. And when they open the jar, they will be able to get the notes from the jar. We haven't built it yet, but in terms of the actual like different paper ball inside a jar,

11:59this [music] part where I asked AI to use the assets from Sarah's animation, like the paper ball, and put the paper ball in between the jar front layer and jar back layer, and that's what it creates this effect here. So, Sarah doesn't need to draw every single possibility of how many paper balls in the jar or not. But then, people can just bring up this, write down some notes, take video, [music] and save it, and then play the animation,

12:29and it's to show up here. And that's kind of the final product. Yeah, so I think what I really love about this is that in really a couple hours, right, you were able to go from like kind of this simple idea into something that's actually like working on a phone. And obviously, there's more to it. You're probably already thinking of more ideas that you can add or change to this app to make it work even a little bit better or smoother or whatever. But I think it just goes to show how fast you can really go from like this design to something that's working. To me, that's like really,

12:57really cool. My question for you was going to be something around like for someone watching, what would be like your best advice or tips if they want to start designing apps that look a little bit more handcrafted and building them, you know, with CodeX or Cloud or whatever. What would be like two or three really practical tips that you

13:14guys would give to the audience? I think because of AI, everything got so much easier to build, and a lot more people are building apps now. But that doesn't mean you can't find a a angle or perspective to a problem people already solved. Yeah, so just try to find ways [music] combine different niches and see what you can come up

13:34with. So before I start the on chair project, I was a freelance illustrator and I never thought I can do something like put my animations or illustration into an app cuz most apps look more flat design and simple style. So if you have some unique drawing style, just don't afraid [music] to put them into something new. Totally agree with that. I think especially in the age of everyone just building and and designing stuff with AI, it's like how do you stand out? And I think part of what made Cat on Chair successful, that's just my opinion, is that it looks just so different than everything else that's built out there

14:16right now. I think that would just really stands out to people. It doesn't look perfect. It doesn't look polished. It looks really like a human designed it, which you did, Sarah. So I think that's part of the reason why it's successful. Well, thank you both, Sarah and Ryan, for coming on to Star Story Build and kind of breaking down a little bit of your process. For people watching, if you have any questions or comments, please leave a comment for them in the comment section here. Yeah, thank you guys so much. Maybe we'll have you back on the main channel again when Cat on Chair is doing 50,000, 100,000

14:42dollars a month. Hopefully you get there someday. But yeah, congrats on everything and thank you. Thank you. Thanks for having us.