Contents
Introduction to Design
This course explores the fundamentals of how to design an iOS app. You'll learn what you need to consider in the design process and the various tools available.
Learning Objectives
- Learn the fundamentals of iOS app design
- Learn how to use Adobe XD
- Understand the various design components you can use for your apps
Intended Audience
This course is intended for anyone who wants to learn how to develop apps on iOS.
Prerequisites
To get the most out of this course, some basic knowledge of iOS development would be beneficial. We recommend that you take this course as part of the Developing Mobile Apps for iOS learning path.
Hi, within this lecture we're going to see the text and the output. So, let's start with text because it's pretty easy. You can just write something when you choose text like this, okay? And you get to change its properties over here, like this. You can just make it lowercase, uppercase. You can just make this a superscript, a subscript. You can change its alignment, you can change its font like this, but in order to change the font, in order to increase the font size, you have to make sure that you have enough space like this so that it would take effect. So, if you hit your upper arrow over here you can increase the font size, you can change the font by clicking over here like that. And you can even change the fill color of the font, like that. Okay, so you can change to any color that you want from the color inspector over here and you can even give some borders to your fonts, and you can even give some shadows as well. So, it's pretty easy to work with texts like that. And if you double click on a text, you get to edit it. And in this case editing means just adding some new characters or deleting the characters. So, as an example, let me delete everything from here and we can do the tap to select image thing that we have done in the previous sections. Okay, so let me create a rectangle right now, like that. Okay, and let me delete the border so that I can come over here to text and I can just create a text over here and say tap to select. After that, I can just select the select tool and just make this a little bit bigger. And then I'm going to give some white color to my text and let me put this over here and try to adjust this a little bit so that it would be more central like that. So, here we go, now we can export this and use it on our projects. And we're going to see how to export views and how to use an XCode later on, don't worry. Right now I'm just doing some practice to show you that you can really easily create visuals using your own apps. And there is a zoom over here and it's pretty basic. So, if you just choose it you can zoom in or zoom out like that, okay? And here we have the artboard. So, if you choose the artboard, if you click some bar over here in your pace bar, it will just add a new artboard. And as we have discussed before, artboards are just to give us some frames so that we can easily do our design like that. So, we can just choose any size that we want from here, like an iPhone or an iPad or an Android phone and we get to change its size once we create it like that. So, you can just create any artboard that you want and you can use it like a frame over here, and we can actually put some views in the pasteboard as well. But we generally prefer doing that in the artboard so that we can really see what will our design look like in a real form. Okay, so that's why we're using artboards actually, to be more structural, to be much more organized, and to see better what our design will look like in the real life. So, let's stop here and continue within the next lecture.
Atil is an instructor at Bogazici University, where he graduated back in 2010. He is also co-founder of Academy Club, which provides training, and Pera Games, which operates in the mobile gaming industry.