Aloa's Standard App Design Process

You guys were really curious to hear about how I design my apps and specifically how I make them feel 10 times better than the default iOS experience. I get a ton of compliments on my app saying that they just feel different, a little bit more polished, more fun to use. So today I'm breaking down some of the advanced techniques I use to achieve that. If you're new here, welcome to the channel. My name is Chris and I build productivity apps. I already made a video covering the basics of my design process like mood boarding and wireframing, but today we're going to be going a little bit deeper. These are practical things that I'm doing and applying to my own apps to really give them that polished and fun to use feel.

Another way to add dimension to your app is to make it more interactive and just have a little bit more movement. Most apps are pretty static. When you're clicking on tabs in any of the default Apple apps, they kind of just appear instantly. There's no animation, probably for a good reason. They're serving a billion users. Maybe it's a motion sickness thing or an accessibility thing, but again, we're not Apple. So, what I like to do is try to add animation anywhere I feel is appropriate. So, for example, in my app Luna, I could have made it where when you're switching between the tabs, it just instantly appears like all of the default iOS apps, but instead, I decided to actually animate that page change. When you're switching between different pages, they actually slide over from the previous page. I'll slow it down so you can see this animation better. Granted, this did take me like 5 days to build because I didn't have AI at the time, but I think now with Claude Code, you can actually get something done like this in less than an hour. Here's an even better example of where I went a little bit above and beyond on the interactions. So, I have this feature in Ellie where you can dictate tasks to the AI assistant that I built. So, something I spent a lot of time on was a custom animation sequence. When I slow it down, you can see a lot of things are happening here. The send button rotates into a check mark. The background expands from the microphone and the listening text fades with this kind of spring animation. And all of this stuff adds up to a really satisfying animation that I think adds a little bit more to the experience. This might seem small, but if you do this a 100 times throughout your app, it's going to add up to this very premium experience, which again makes your app feel way better than the default iOS apps. Something I want to point out, too, is that a lot of this stuff is actually not as hard as you might think. The cool part is I actually just vibe coded this completely with cloud code. I didn't write a single line of code for this. I'll give you a tip. When it comes to complex interactions like this, don't try to oneshot this and say, Hey, can you go animate this for me? Because it's not going to come up with anything this cool and complex. For this one, I had to break down all the sub animations that I wanted to happen. Can you make the arrow rotate into the check mark? Can you have that background expand from the microphone? Can you add some of this fade in fade out for the text? So, I broke down all the components I wanted to happen in the interaction and it just executed it for me flawlessly. Apple has a really good built-in API for animations and Claude Code and a lot of AI coding tools are very well trained on it. So, you can actually just tell it to do this stuff for you in plain English and it has a really high chance of doing it. But again, the trick is to not oneshot it and to instead break it down into steps.

Tip number two is custom illustrations, especially for things like empty states. So, this is when your app has no data in it and it's just kind of an empty screen. A lot of apps just have a text that say there's no task for today or something like that. I want to go a step beyond that. Add custom illustrations or even animations to those empty states. This is something you can actually do with the AI tools on the market. So, in my case, for my app, Lily, which is a meeting assistant app, I have this ghost mascot. What's really cool with AI tools like chat GPT, you can actually take a base mascot like Lily, feed it into chat GPT, and with the right prompts, you can actually generate almost an infinite amount of variations of this mascot. I actually used it to generate the empty state for the search page. Now, instead of it just saying there's no meetings here, instead there's this illustration of Lily the Ghost searching for tasks. Or if there's an active meeting going on, I can have a custom illustration of Lily taking notes or sleeping or drinking coffee or walking my dog Luna. AI has really opened the door to make infinite illustrations and it does add a ton of personality and really makes your app stand out. My recommendation is to try to find some sort of artist or illustrator to make you a base illustration if you can. My case, I actually asked my girlfriend Cecilia to draw up some illustrations for me and now I have a base mascot to work off of and make an infinite amount of variations on. I really do recommend starting with custom illustrations because it does make it feel a lot more original. If you can't do that, you can use chatt to make these mascots for you. My advice is to be really creative when you do this. You're going to feed in reference images. Try to feed in a bunch of different reference images. That way, it just comes up with something a little bit more unique or really tweak the prompt and try to get creative to make it deviate from whatever references you're putting in. But again, if possible, I do recommend commissioning an artist or a graphic designer to do this for you. It's actually not as expensive as you might think. If you want to take it to another level, which is something I haven't even gotten to yet, you could animate these custom illustrations. So, someone was actually kind enough to take the illustrations that I made and animate some of them using Rive. I was really impressed with the results, and I do plan on adding these to the app. I haven't tried it yet, but I already know it's going to add a whole another layer to the app. So, that's something I'm going to be trying soon, and if you can, you should try it, too.

Another way to add dimension to your app is haptic feedback. This is when you click a button, you touch the app, and the phone kind of subtly vibrates and gives this physical feedback back to the user. This is something that adds a lot of depth and honestly just makes the app a lot more fun to tap for the user. Something I noticed is that Apple's default apps barely use haptics. To be fair, there probably is a reason they don't have haptics. They're designing for a billion users. Maybe it's a battery thing or an accessibility thing, but we're not Apple, so we can probably make choices that they can. So, in my budgeting app, Luna, almost every single button click has some sort of haptic feedback. Here's the key. Not all haptic feedback is equal or feels the same. You can actually control the strength of the vibration in the code. So for certain buttons, I add a lighter amount of haptic feedback. And for other buttons, I do a heavy amount of haptic feedback. When you're inputting a transaction where there's a lot of clicks, I really go light, but then when you're doing something like changing the tabs, it's a little bit heavier. I really wish I could convey what the haptics feel like in the video, but if you're curious, I'm not going to stop you from downloading the app to try it. Concern that I hear is that if you add a lot of haptic feedback, it's going to feel annoying. But I think when you do it correctly in the right places, it's actually very satisfying. I think there's just something addictive about physical feedback, kind of like clicking a pen, you just kind of want to tap around. If you can get people clicking around your app for fun, I think that's only a positive thing.

Icons. It's something a lot of people overlook, but when you get it right, it feels really good. And more importantly, if you get it wrong, your app just does not feel that good. When you're building an iOS app, most apps use SF symbols, which is the default icon set that Apple gives you, which are completely fine. There's nothing wrong with them, but they are pretty generic and almost every single app uses them. When I was studying a lot of the best apps out there and trying to figure out how to make mine stand out, I realized that picking really good icons and spending a lot of time on them made a huge difference. I spend a lot of time looking for the right icon pack for my app. One of my favorites that I use, which I'm actually using in Luna, my budgeting app, is called Hero Icons. And specifically, I'm using the thin version of the icons. It's minimal, clean, and free, and you really can't go wrong using something like this. But there's tons of icon packs out there that you can use. The first mistake that I see people making is picking the wrong icon style. Even with something like Hero icons, which all the icons look amazing. The style of icons really does make a difference. So, let's take a look at the tab bar in Luna, which is my budgeting app. I'm using the thin version of the icon pack here. You can see it looks very clean, very minimal. Watch what happens if I just switch to the thick versions of this. To some people, this might not be a big deal, but the differences in using the thin and the heavy versions actually really does change the entire feel of this tab bar, which then changes the feel of the app. So, depending on what kind of feeling you're going for, I think picking the right icon set makes a big difference. Usually, it boils down to are you going to pick icons with simple and minimal lines? Are you going to pick icons that are more filled and heavy, or are you going to pick icons that are very complicated and have many lines? All three of these do send a different message to the user. So, choosing is very important. But the most important thing to do when you do pick a style is to stay consistent with the style. This is a very common thing I see a lot of apps do is mixing and matching icon styles which really make the app feel less cohesive. So looking back at Luna's tab bar, it's again very clean minimal icons. Watch what happens when I swap two of the icons to a heavier version. It's not as uniform as the version where it was all minimal icons. So when you pick a style, making sure to stay consistent across really does make a big difference. But there is actually a time when you can use style. So here's another tip. it's to potentially use a different style to show different states. So, for example, in the tab bar, when I click something on Luna, it starts out as the thin version, but I actually use the heavier and filled out version of the icon when it's selected, which actually does make a big difference. So, here's what it looks like in the app now with the heavier version. And here's what it would have looked like if I didn't use that version and just highlighted it. It's really subtle, but I think it does add some depth. Apple doesn't even do stuff like this. Check out the phone app. When you click on the different tabs, they're using the exact same icon style, but just changing the color, which does work, but again is a little bit basic. Spending a little bit more details on what icon style you're going to use for the active and the non-active state, which icon pack are you using. All of this stuff adds up and it will make the app feel even better than the Apple default apps.

So, the last tip I'm going to give you, which answers one of the most common questions I get, which is, how do I come up with these good designs? How do I just elevate the feeling of my app in general? and it is to expose yourself to really good design constantly because it's not a one-time thing. I really do think that it is a process to get better and elevate your taste. And I have two specific places that I go to do this. Number one is Twitter. There's a ton of really good talented designers on Twitter. So, I recommend just go finding them, following a bunch of designers, and then you'll just see a bunch of their stuff on your feed and bookmark everything that you like. But constant exposure like this is really important. And the second one is a website called Mobin. So, huge thank you to them for actually sponsoring this video. If you've been following along, you know that they are my favorite design resource. Even if they weren't sponsoring, I would recommend them anyway. I absolutely love them. But if you're not familiar, it is a huge design resource that just has thousands of app screenshots. So, you can see how some of the best apps are doing their layouts, how they're doing their tab bars, what icons they're using. It really helps you answer these questions. I use Mobin in two ways. Sometimes I just scroll through for inspiration. Again, if you want to elevate your design taste, you can just go through Mobin, scroll for a couple minutes a day. Guarantee if you just do this, you will naturally just start picking up on certain patterns and just elevate your taste. You're going to figure out what you like, what you don't like, what color palettes make sense, what icons people are using that you resonate with. You'll discover this just by browsing something like Mobin. Even just doing it once a week will have a pretty big impact. I think I also use Mobin to answer very specific questions like going back to the icons. What icon set should I use for my app? I like to go in Mobin, see the different icons that apps are using and really figure out, okay, which one matches the aesthetic that I'm going for. So, you can use Mobin to answer questions like that. It's very cataloged. Just search tab bar on Mobin. It'll show you a ton of different examples of tab bars. It's my favorite place to browse, find some design inspiration, and just elevate my design sense. A little bit more general of a tip, but if you do this, it's almost impossible not to get better at design.

So, these were the top tips I have for making your app feel a lot better than the default iOS apps. Again, it's not one big thing. It's actually a bunch of small things that when you put them together really do add up. I probably have a lot more tips that I can share, but these are the ones I had off the top of my head. So, I hope you guys found them helpful. If I can make something like a finance app feel fun to use, you can definitely do it for your own app, too. But, thank you guys so much for watching. If you want to see my general design process, I'll leave a link to that in the description below so you can see things like how I do mood boarding, how I do wireframing. But if you like this kind of content, check out my Instagram and Tik Tok. I post almost every other day about building productivity apps. And obviously, if you like this content, don't forget to subscribe. But thank you guys so much for watching and I'll see you guys in the next video.

Greg Isenberg here and today I'm sitting down with Chris, an indie app developer who's built some of the most polished apps I've seen. We're going to go deep on specific design details that separate apps that feel amazing from apps that feel generic. Chris has this philosophy that it's not one big thing that makes an app stand out, it's actually hundreds of small decisions compounding together. And today he's going to walk us through the exact playbook - animations, illustrations, icons, widgets, all of it. If you're building a mobile app and want it to actually feel premium, this is the conversation. Chris, let's start with what you think is the single most important design detail that most indie developers are overlooking.

So the number one thing that I think separates really great apps from okay apps is animations and interactions. Most apps are completely static. You tap a button and things just appear. There's no movement, no transition, no life to it. And I think that's the single biggest missed opportunity. When you add thoughtful animations throughout your app, it completely transforms how the app feels. It goes from feeling like a prototype to feeling like something that a team of 50 people built at a top company. The good news is that with AI coding tools, this is way more accessible than it used to be. I used to spend days building a single animation. Now with Claude Code, I can describe what I want in plain English and get production-ready Swift animation code. Apple has really good built-in animation APIs, and AI tools are very well trained on them. The trick is to break complex interactions into sub-steps rather than trying to describe the whole thing at once.

Let me give you a concrete example of why animations matter so much. There's this app called Amy, a calorie tracking app. The developer posted a tweet showing the app with all these beautiful animations - smooth page transitions, satisfying micro-interactions when you log food, this really polished counting animation for calories. The tweet went absolutely viral. Millions of views. But here's the thing - the concept of a calorie tracking app is not new at all. There are hundreds of them. What made people stop scrolling and pay attention was purely the polish. The animations made it look and feel like something special. I actually saw another developer post a very similar calorie tracking app around the same time, but it was completely static. No animations, no transitions. And it got basically no engagement. Same concept, dramatically different response. That's the power of animations. They're not just decoration - they're the difference between people caring about your app and scrolling right past it.

Let me show you some specific examples from my own apps. In Luna, my budgeting app, when you switch between tabs, the pages don't just appear - they slide over with this smooth transition. I'll slow it down so you can really see it. The content slides in from the direction you're navigating. It's subtle but it makes the whole app feel more spatial and connected. In Ellie, my daily planning app, I built this custom dictation animation for the AI assistant feature. When you slow it down, there's actually a lot happening. The send button rotates into a checkmark. The background expands outward from the microphone icon. The listening text fades in with a spring animation. Each of these is a simple animation on its own, but together they create this really satisfying sequence. I actually built the entire Ellie dictation animation with Claude Code. Didn't write a single line of code myself. The key was breaking it down - I told it to animate the button rotation first, then the background expansion, then the text fade. When you try to one-shot a complex animation, AI tools struggle. But when you break it into individual sub-animations, they nail it almost every time.

Another thing that really elevates an app is gamification through design. Streaks are a great example. When a user hits a streak milestone, don't just show a number - make it feel like an achievement. I've been experimenting with holographic sticker effects for streak milestones. When you hit a 7-day streak, you get this shimmering holographic badge that actually responds to your phone's gyroscope, so it shifts and catches light as you tilt your phone. It's the kind of detail that makes users screenshot your app and share it. Stickers in general are really underutilized. You can create collectible stickers that users earn for different achievements. The holographic effect makes them feel premium and collectible, like real holographic trading cards. People genuinely get excited about collecting these things. And with AI tools, building these effects is surprisingly approachable. The gyroscope-reactive holographic shader sounds complicated, but Claude Code handled it after I described the effect I wanted. The implementation uses Core Motion for the gyroscope data and some shader math for the holographic reflection. A few years ago this would have been a week-long project. Now it's an afternoon.

Custom illustrations add so much personality to an app. Especially for empty states - screens where there's no data yet. Most apps just show plain text saying there's nothing here yet. But if you add a custom illustration, suddenly that empty screen has character. For my app Lily, which is a meeting assistant, I have this ghost mascot. My girlfriend Cecilia illustrated the base character for me, and then I use ChatGPT's image generation to create infinite variations. Lily searching for meetings, Lily taking notes, Lily sleeping, Lily drinking coffee. Every empty state in the app gets its own unique illustration. My recommendation is to start with a real artist for the base illustration if you can. It makes everything feel more original and cohesive. Then use AI to generate the variations. Feed the base illustration into ChatGPT along with a description of what you want the character doing, and it'll generate something that's consistent with the original style. If you can't work with an artist, you can use ChatGPT to create the base character too. The trick is to feed in multiple diverse reference images so it comes up with something unique rather than generic. Combine references from different styles and really push the prompt to be creative.

Let me actually show you how I do this live. So I'm going to open ChatGPT and I'll feed in the base Lily ghost illustration. I'll say something like, generate a variation of this ghost character sitting at a desk taking notes in a meeting, maintain the same art style and proportions. And you can see it generates something that looks consistent with the original. The key is being specific about what you want the character doing and explicitly telling it to maintain the style. If you're less specific, it tends to drift from the original look. Now let me try something more creative. I'll combine the Lily style with a reference from a completely different art direction. I'll feed in both references and say, create a ghost character that combines the simplicity of the first reference with the texture and warmth of the second. This is where it gets really interesting because you end up with something that feels genuinely unique. It's not a copy of either reference. I do this for every empty state in my apps. The search page gets a ghost with a magnifying glass. The error page gets a confused ghost. The onboarding gets a waving ghost. Each one takes maybe five minutes to generate but they add hours of personality to the app. If you have 15 empty states in your app, that's 15 opportunities to delight users instead of showing them boring placeholder text.

If you really want to take illustrations to the next level, animate them. Someone in my community actually took some of the Lily illustrations and animated them using Rive. The results were incredible - the ghost character breathing, blinking, floating up and down. It adds this whole other layer of life to the app. I haven't shipped these yet but I'm planning to. For onboarding specifically, animated illustrations are a game-changer. Instead of static screens explaining your app's features, you can have animated characters demonstrating them. It makes the onboarding feel less like a chore and more like a story. Here's another tip that I haven't seen many people talk about. You can use Midjourney to generate reference frames for animations. Generate the character in different poses, then use those as keyframes in your animation tool. Midjourney is really good at maintaining character consistency across different poses if you use the same seed and style parameters. So you generate pose A, pose B, pose C, bring them into Rive or Lottie, and create smooth transitions between them. It's a workflow that barely existed a year ago and it produces results that would have required a professional animator before.

Let's talk about icons. This is something that seems minor but actually has a huge impact on how cohesive your app feels. The number one rule with icons is consistency. I cannot stress this enough. Pick one icon style and use it everywhere. Don't mix thin lined icons with heavy filled icons on the same screen. It instantly makes your app feel like it was assembled from random parts rather than designed as a cohesive whole. There are a few great icon resources I recommend. Hero Icons is my favorite - it's free, minimal, and has both thin and filled versions. I use the thin version for Luna and it looks really clean. Font Awesome is another solid option with a massive library. And Nucleio has some really premium icon sets if you want something with more personality. The key decision you need to make is: are you going for thin and minimal, heavy and filled, or detailed and complex? Each sends a completely different message. Thin icons feel modern and airy. Filled icons feel bolder and more established. Complex icons can feel playful but risk looking cluttered. Whatever you choose, commit to it across every single screen. One technique I love is using different icon weights for different states. In Luna's tab bar, inactive tabs use the thin outline version, and the active tab uses the filled version. It's really subtle but it adds depth that even Apple's default apps don't do.

Widgets are probably the most underutilized retention tool in mobile apps right now. Think about it - if someone puts your widget on their home screen, they're seeing your app 50 to 100 times a day without even opening it. If they put it on their lock screen, that number goes up to 150 or more daily impressions. That's insane brand reinforcement for free. I've seen widgets literally double the retention rate for apps that implement them well. The key is making the widget genuinely useful, not just a shortcut to open the app. For Luna, the widget shows your spending for the day and your remaining budget. For Ellie, it shows your next task and how many tasks are left. Users glance at it, get the information they need, and your app stays top of mind. The other thing about widgets is that AI has made them dramatically easier to build. Widget development used to be this painful thing with all these size constraints and complications. Now with Claude Code, you can describe what you want your widget to show and have a working implementation in hours, not weeks. I'd say widgets are one of the highest ROI features you can build right now. Home screen widgets, lock screen widgets, and especially Apple Watch complications if your app has data that makes sense at a glance. The lock screen placement in particular is a game-changer because users see it every single time they pick up their phone.

Let me share the specific resources I use to stay sharp on design. Mobbin is still my number one - it's a massive library of real app screenshots organized by feature and flow. I browse it almost every day, even when I'm not actively designing something. Just exposing yourself to how the best apps handle common patterns gradually calibrates your taste. Then there's 60fps, which is specifically focused on mobile animations and interactions. If you want to see what great animations look like in practice, this is where to go. They curate the best examples of motion design in mobile apps. Spotted is another one I check regularly. It's like a curated feed of design details and patterns from real apps. Really good for discovering small touches you might not have thought of. And Prod is great for seeing full product flows rather than individual screens. I also follow what I call the Screenshot First Company approach. Every time I see an app that does something well, I screenshot it immediately. I have thousands of screenshots organized by category - tab bars, onboarding, animations, empty states. When I'm designing a new feature, I go through my screenshots first before even opening Figma. One last thing - don't underestimate your app store screenshots. They're the first design impression most users will ever have of your app. Spend as much time on those as you do on the app itself.

So that's the playbook. Animations, illustrations, icons, widgets, and constantly feeding your design taste. None of these things individually are going to transform your app overnight, but when you start stacking them together, the compound effect is massive. Your app goes from feeling like a side project to feeling like something that a world-class team built. And the best part is that with AI tools, almost all of this is dramatically more accessible than it was even a year ago. You don't need to be a designer or an animator to pull this off. You just need to care about the details and be willing to put in the reps. Chris, thank you so much for breaking all this down. If people want to follow your work, where should they go? You can find me on Twitter and Instagram where I post almost every day about building apps. And obviously check out Luna and Ellie on the App Store if you want to see these techniques in action. Amazing. Thanks everyone for watching, and we'll see you in the next one.