UI Kit Creation with Sketch

UI Kit Creation with Sketch

“Hey how good, you have reached the end of the course, I hope you liked everything I taught you! Now you know everything you need to create your own UI Kit. Throughout the course I showed you the process I follow to make mine under the concept of a Music App. Now is your time and you are ready to carry out your own project. Let your imagination fly! Create a UI Kit for any App you can think of, or if you already have a project on the doorstep, I recommend doing it on it. What do you think if we give a brief review of the steps to follow to make it easier for you to do it? What product? Explore and analyze a product that is already on the market, that is, it is already launched, because in this way you will have an advanced starting point and it will be easier for you to work on your UI Kit.

The first configurations Once you have the product ready you can start working with the settings such as colors, font and grids of your UI Kit. Give it the necessary settings so that it has the look and feel what do you want! Icon Set Unify the set of icons that you will use for your design. Remember to give it your personal touch, this always adds more to your project, if your idea is to show it to a client this will definitely give you a plus. The components Start by creating the simplest components like buttons, inputs , icons, chips , and so on. Continue with the rest of the components, I mean the cards , navbar , menus, lists and your headers . Don't forget to create several variations of yourself so that you can choose the one you like best in the end. Create your screens and present your UI Kit Once you have all the components ready, you can start to unify them and start working on the screens of your application. Once your screens are ready, get ready to present your UI Kit. Keep in mind that how you present it will be very important, as this will open the doors for you with your clients. So, I recommend you create some examples of uses in some key screens. Remember to emphasize the components that you consider most important and create a library in Sketch with your components so that you can update them later, this will be very useful in the future for when you want to use them in other projects. Ready, you already have your UI Kit! Do not forget to share the final result of your project in the forum, in this way we will keep in touch and I will be able to give you feedback as soon as possible. I invite you to also observe the work of your colleagues and, above all, if you have some kind of tip share it with the community. I will be looking forward to seeing what you have created. See you on the forum! ”

Partial transcription of the video

“Final project Let's make a summary of what was seen throughout the course. I talked about how I came to design digital products and the projects in which I developed in a professional and personal way. Then I shared some influences and, before working, we talk about the final project. We address basic concepts, such as what is a UI Kit and the benefits of having one. I showed you my methodology when creating components within Sketch. We analyze our project and what components it would have. We define our "look and feel" by selecting colors, the font grid and icons that we apply later in eac...”

This transcript is automatically generated, so it may contain mistakes.

Course summary for: UI Kit Creation with Sketch

• Level: Beginner
• 91% positive reviews (23)
• 634 students
• 5 units
• 17 lessons (3h 1m)
• 11 downloads

• Category

  Web & App Design

• Software

  Sketch

• Areas

  App Design, App Development, Interactive Design, Mobile Design, UX / UI, Web Design, Web Development