Every mobile app has certain components that are always present, two of these include an icon and splash screen. It’s sort of the standard for most if not all mobile apps and Course Assist is no exception to this. In this blog, I’ll walk you through how I went about creating essential components which are the icon, splash screen and a component that isn’t always present in all mobile apps but is essential to Course Assist, the verification email template. Let’s get straight into it🤸♀️
Creating an app icon and Splash screen✍️
Course Assist was built using React Native and Expo. Expo is a framework for building React Native apps, it comes with some nifty tools and services that make building react native apps fairly easy. Some of these tools and services include an integrated splash screen for your app that works on both iOS and Android. I used Figma to create the app icon and splash screen. Expo offers a neat Figma template you can use to create these components👌🏾. All I had to was fit my app logo in the icon template and the splash screen template to create them. It also comes with a preview so I could see exactly how it’ll look once it’s running on a phone. I then exported them onto my local machine and copied the icon and splash screen into my app folders. The image below is of the Course Assist Expert splash screen.
Creating a verification code email template📩
The Course Assist apps are passwordless meaning users don’t need a password to access the app, for a user to sign in all they’ll have to do is input their email address and a verification code will be sent to their email. They can then enter that verification code in the app to get access. The email that displays this code has to be visually appealing so to create this I found a nice drag-and-drop website that lets you edit already-made email templates and export them as HTML files🙌🏾. I designed one for Course Assist, exported the HTML file and changed a couple of things in the HTML code to make it look better. The image below shows what the verification code email looks like on mobile.
With these essential components now added were now even closer to the launch of Course Assist. I’m targeting next week for the official launch starting with the Course Assist Expert App, something you’ll not want to miss so stay tuned to the blog. Thanks for reading🙏.