Bundling the App for Production

[00:00:00]
>> So our app is ready at this point. I mean, it's doing all that we want. But we need to finish the process. And for that, if we go to the home screen of my emulator, my app, Is, actually, I will do it again because, I need to delete this one.

[00:00:25]
So you didn't see this. This is the other one that I have. Okay, so if you open the menu, our app is installing my phone, but with a default icon, okay? And yeah, that doesn't look right, also, it's going to be rejected from the Play Store, okay? We actually need to replace that icon.

[00:00:50]
So how to do that? So in the res folder, apart from drawable, we also have a section for mipmap. Does anyone know what mipmap is? Have you seen mipmap anywhere?
>> Gaming.
>> Gaming, and do you know what it means in gaming, mipmap? As a fun fact.
>> I guess on map is different, but isn't it something like that where it's positioning data of the texture on-

[00:01:32]
>> It has to do with textures, with let's say the viewers position. So actually, mipmap is, for example, let's say I know first person shooter or something like that. When you have an object that is really far away, the texture that is being used is a very low resolution texture.

[00:01:49]
And we are getting close to that, it's changing the texture with a better one, okay? Well, here they're using the same term for the icon in different resolutions. So unfortunately, Android is not supporting SVG or shapes, it's supporting PNG. But not one PNG, we need to provide several versions of PNG.

[00:02:16]
Also, it can be WebP, no one is using WebP anyway, only the default icon. So what we need actually is I'm going to delete this. This is called ic_launcher. Ic from icon. So the icon launcher, okay? So I need to delete these files. I don't need to delete, you can just replace them.

[00:02:42]
Actually, we need several versions in several resolutions. It's actually really problematic. Most tools for mobile prototyping, they let you export the Android way. But fortunately, we don't even need that. Let me show you how that works. Over mipmap, I'm going to right-click, and I'm going to add a new image asset, not a vector asset.

[00:03:07]
Vector asset is not gonna work for the apps icon, okay? So we are in image asset. And here, I have an icon tool where I can select, firstly, icon that I want for the foreground. By default, it's taking an image that I don't want, okay? So I need to pick an image that I wanna use.

[00:03:30]
And from the assets.zip file that you have in the repository, we do have here, An icon PNG, okay? That one. But look at that, that icon doesn't look right. What's the problem with that icon? Android today, since Android 8 Oreo, there's been a couple of years since then.

[00:04:00]
It supports different shapes, different masks that are being applied to the icon. So actually, what you need to do is to resize your icon to add more padding to the icon until you are happy with how it looks like on every possible shape. So it depends on the manufacturer and the phone model that you have, or even the launcher because you can change the launcher in your Android phone, it's the shape that is going to use.

[00:04:27]
Of course, that green that you see doesn't look right, so you go here to the background layer. And we're going to change that background. Sorry, the background layer, we're going to use a color instead of the green. I can click here and I can use a picker. And I can just pick the white one from here, okay?

[00:04:51]
So this is the final icon, and if I'm happy with it, I will call it ic_launcher. I can change the name, but this is the default name for the icon launcher. And when you hit Next, it will tell you that it will replace the ones that you have if you're happy with that and say, yes, finish.

[00:05:09]
And now, if I run the app again, That's giving me an error. So let's see, duplicate resources. There we go. So the problem that I have right now is that because I'm using PNG and not WebP files, so they have the same name, so I need to delete the WebP.

[00:05:30]
The WebP is the default one, so right-click > Delete. But it says, you know what, someone is using this, are you sure you wanna delete them? Yeah, delete it anyway. And also, we have the same problem on round. We have WebP files, but it's round. Round is actually prepare optimized for round icons that is typically used on watches, okay?

[00:06:06]
So I need to also delete, You can also delete these WebP files before putting yours, and it will skip one process. Okay, so now we are done here. If we go to the launcher, our app look fine as expected. And you can add it to a home screen if you want, an icon and put it in the home screen of any other app in the Android system.

[00:06:37]
So what if you wanna share this app with a friend, or what if you wanna upload this to the Play Store? Well, you need to build the final file. To do that, you go to the Build menu, and you need to select Build Bundle(s) / APK(s). And here, we have two options, Build APK(s) and Build Bundle(s).

[00:07:02]
So an APK, it's an Android package, is the only format compatible with the phone. So if you wanna send a friend your app, you need to create an APK. Bundle is for the Play Store only and only Play Store. If you're going to publish in other stores such as the Amazon App Store or the Microsoft Store that is accepting Android app for Windows, you must use our APKs as well, okay?

[00:07:27]
And from here, you hit Build APK(s), this is going to build your app. And when it's ready at the bottom, it will say that your APK is ready. You can locate the file, and that's your debug APK. So it includes debugging accessories. If you don't want debug and you want production in the same view, you go and generate a signed bundle APK, Where you pick using Android bundle or APK.

[00:07:56]
But for a friend, you can just send the debug version, okay? And next, you need to create a signature if you want to create the production version. But if you create the production version for the Play Store, it's AAV, you don't need to sign. This is kind of an old mechanism.

[00:08:15]
So today, if you wanna test in your own devices, you just generate an unsigned APK and that will work. And if you wanna go to the Play Store, you need to create an Android App Bundle that you do it from there, okay? So in the menu Build, you create an Android App Bundle, and that's all.

[00:08:35]
Actually, what's going on with Android bundle? The idea is that in Android, a lot of developers are inserting a lot of assets, right? High resolution, low resolution, lots of eMachines. Sometimes eMachines in different languages. And when you are downloading that from the store, you will download all the assets.

[00:08:55]
Even the assets that you will never render in your phone because your phone is not high resolution. So when you upload an app bundle, the Play Store will actually create an APK for you. And he will ship to the user the APK with only the resources that user will need, okay?

[00:09:19]
It's for efficiency if you want, okay? Make sense? Any question on the building process and finishing the process, the icon?
>> You said, I don't wanna get lost, you said Android doesn't support PNGs but then you get PNGs exported out.
>> Yeah, what you need here is PNGs, but it doesn't support just one PNG.

[00:09:46]
So I'll tell you, when we actually see these in the real file system, so if you right-click > Open In > the Finder, but you're going to see here, let me zoom in a little bit. It's a lot of mipmap folders, so it's not one folder. We have different, these are called qualifiers.

[00:10:04]
So we have folders with qualifiers. So we have mdpi, that means medium DPI. We have hdpi, high DPI, anydpi, this is trouble. And then this is like the adult mode, xxx, extra, extra, extra high DPI. And you have different PNG in different sizes for different phones. And also, you have the foreground, the round version, and the square version.

[00:10:33]
So creating all these files manually is actually a lot of work. That's why it's better to use the mipmap generator that we have within Android Studio to generate all these assets. As an input, it's better to have a really high resolution PNG version of your icon, like 512 by 512.

[00:10:52]
Then the final sizes as I mentioned will be created automatically by Android Studio.
>> Okay.
>> Okay, make sense?
>> Yep, what did the mip actually stand for, MIP?
>> Actually, I don't remember, and I'm not sure if it has any meaning. I mean, when Android started doing this, adding that mipmap folder that wasn't serving them since the beginning, I think it was five years ago.

[00:11:19]
Before that, the icons were actually in the drawable folder. In fact, today, if you move the icons into the drawable folder and remove the mipmap, it will work anyway. But they separate this, and I actually learn about mipmap at that time because I've never heard of mipmap before.

[00:11:35]
So what's that? Well, and then I realized that it had to do with textures on gaming in different resolution. So they're doing this with icons and other things that you need to ship with your app in different resolutions. And the idea is that on drawable, it's better to have elements, single elements for single resolution, that kind of idea.

[00:11:57]
But to be honest, I don't remember if MIP has any meaning, we can go with that, but anyway. Any question, any final question? So our app is ready, shipped to the store. Of course, if you wanna publish this in the store, you need to create the publisher account, the Google Play Store.

[00:12:17]
It's $20 US of one-time fee. I mean, it's not about the money, it's not like Google is making a lot of money for those $20. It's just to have a minimum filter, okay? That you need a credit card, and you need to have $20 to spend to publish apps, and that's all.

[00:12:35]
When you submit your app, your AAB, the Android bundle that you create from here, there is a very tiny QA process in the store that will check your app. And if everything is correct in a couple of hours, it will be republished, okay? So that's all for how to create Android app.

[00:12:55]
And if you wanna share this with a friend, an APK, your friend can just install that directly from the phone or through a USB cable. A buddy that gave, your friend needs to disable security, you need to accept install apps from untrusted sources.