Introduction to Sketch
Course 6: Layouts, Grids, Smart Layouts and Prototyping: 12 column layout
By Samuel Hermoso (Elastic Heads) , UX-UI Designer
Joined August 2014
About the video: 12 column layout
Overview
“In this unit we will learn how to use a layout of columns to fit elements on a responsive screen. The objective is that the text blocks or components occupy entire columns of the layout . We are going to create layouts of 12 columns defining a gutter , which is the distance between them and will be what remains constant.”
In this video lesson Samuel Hermoso (Elastic Heads) addresses the topic: 12 column layout, which is part of the Domestika online course: Course 6: Layouts, Grids, Smart Layouts and Prototyping. Create your first navigable prototype with Sketch.
Partial transcription of the video
“INTRODUCTION TO SKETCH COURSE 6 LESSON 2 12 column layout In this lesson we will see how to create a 12 column layout for web design. The advantages of using a layout is that we have restricted options and so we should not make as many decisions when placing elements. Let's see it. Layouts are a complex thing that not many understand at first, but it's actually a convention to work in a more orderly way for responsive screens, for screens with various sizes. It should be 12 columns because the 12 columns are divisible by 2 several times and they are also divisible by 3 and by 4. The idea of...”
This transcript is automatically generated, so it may contain mistakes.
Course summary for: Course 6: Layouts, Grids, Smart Layouts and Prototyping

Samuel Hermoso (Elastic Heads)
By Samuel Hermoso (Elastic Heads)
Samuel Hermoso has over 20 years of experience working in consulting and digital product design. After working with different studios and agencies, he created the Elastic Heads studio, in Madrid (Spain), where he helps people, companies, and startups adapt to the new changes in the digital world and improve their digital products.
Samuel is also dedicated to teaching, he is a professor of product design, user experience and methodologies, and interactive design tools in schools such as: Ironhack, Mr. Marcel School, IED, Neoland and the European University.
- 0% positive reviews (0)
- 16 students
- 11 lessons (1h 37m)
- 16 additional resources (3 files)
- Online and at your own pace
- Available on the app
- Audio: Spanish
- Spanish · English · Portuguese · German · French · Italian · Polish · Dutch · Turkish · Romanian · Indonesian
- Level: {beginner: "Beginner", intermediate: "Intermediate", advanced: "Advanced"}
- Unlimited access forever
