Take a look at the following design:
It can be very difficult to recreate a design by just looking at it as a picture. You have to be able to closely inspect it, to see things like colors, spacings, typography etc. In this level, we will learn about the key points that you have to keep in mind while converting a design like this one, into a webpage, using simple HTML and CSS. So, let's get started.
Layout design is the process of arranging visual elements — like text, images, and shapes — on a given webpage. It is very important for any website, as it can determine the overall appearance and connection among different visual elements on the page.
Choosing and following the right colors for a website is crucial. Color plays a very important role in brand recognition. When used correctly, color - along with good typography, can be one of the single most important aspects of website design. So getting the palette right at the beginning of the project, is very essential.
Typography has a large impact on how users view your webpage. Good typography helps to create a visual hierarchy (the method of organizing elements to indicate their importance) on your website that is both memorable and aesthetically pleasing for your users.
Define, how end users are going to interact with different visual elements in your application. Interactions have to be practical and usable.
Once, these four key points are defined, let's develop the design of To-Do manager shared above, in the next lesson.