ID104
Design Foundations I - Design Deliverables
Faculty
Egor Nelubin
Freelance UI Designer / Co-founder at Two Studio
Course length
Duration
Total hours
Credits
Language
Course type
Fee for single course
Fee for degree students
Skills you’ll learn
Overview
This class aims to give students the necessary Figma skills to work on future design projects. During the class, students will get hands-on experience working on projects with design systems and libraries of different scales.
The first week will be dedicated to understanding Figma’s core features as a design software. Theoretical explanations will be followed by a mini-project where students will apply their new learning. The main focus of this part of the course is getting a solid base of knowledge about Figma.
In the following two weeks, students will receive a more advanced design brief, which they will be tasked with working on with more attention to details, the structure of the project, and more advanced techniques for building their designs.
By the end of the course, students will be fully ready to take on a design project without thinking about which button to click.
Learning highlights
- Get to know the most important aspects of Figma.
- Learn how to build and utilise components in Figma.
- Learn how to use auto-layout and structure the design.
- Learn how to deliver their designs for production.
- Practice presenting their designs.
Course outline
15 classes
Session 1
Topic: Intro to Figma
Essential tools, Collaboration in Figma, Figjam snippet
Session 2
Topic: Design foundation
Screen sizes, Grids, Layouts
Mid-term brief
Session 3
Topic: Autolayout
Paddings, Alignment, Spacing
Session 4
Topic: Working with text
Typography, Colour, Effects
Session 5
Mid-term project presentation
Feedback and Q&A
Session 6
Topic: Reusable Components
Component sets, Variants, Properties
Session 7
Topic: Variables
Local variables, Semantics, Variable collections
Session 8
Topics: Image treatment. Plugins. Previewing your designs.
Image layers, Blend modes, Most used plugins, Present / Preview
Session 9
Topic: Prototyping your designs
Interactions, Animations, Scroll behaviour
Session 10
Work in class.
Feedback session
Session 11
Topic: Building, using and maintaining a design library
Teams, Publishing libraries
Session 12
Topic: Structurizing and organising design files. Best Practices
Pages, Naming, Hierarchy, Thumbnails
Session 13
Topic: From Figma to production
Technical requirements, Figma dev mode
Work in class. Feedback and Q&A.
Session 14
Final presentation. Feedback.
Session 15
Final presentation. Feedback
Methodology
The course consists of two parts: a mid-term project and a final project. The completion of both of them will be used for the final evaluation. During the course, there will also be:
Lectures, Live demos, In-class exercises, Homeworks
Grading
Egor is a UI designer and a Harbour.Space ID Bachelor's graduate based in Barcelona. Over the years he's designed and developed a variety of websites and applications, created visual identities and built interactive installations. In 2023, together with a co-founder, he started a small studio where he continues to work at the intersection of design and technology.
See full profileApply for this course
Design Foundations I - Design Deliverables
by Egor Nelubin
Total hours
45 Hours
Dates
Nov 27 - Dec 15, 2023
Fee for single course
€1500
Fee for degree students
€750
Explore related courses
Filter by campus:
How to secure your spot
Complete the form below to kickstart your application
Schedule your Harbour.Space interview
If successful, get ready to join us on campus
FAQ
Will I receive a certificate after completion?
Yes. Upon completion of the course, you will receive a certificate signed by the director of the program your course belonged to.
Do I need a visa?
This depends on your case. Please check with the Spanish or Thai consulate in your country of residence about visa requirements. We will do our part to provide you with the necessary documents, such as the Certificate of Enrollment.
Can I get a discount?
Yes. The easiest way to enroll in a course at a discounted price is to register for multiple courses. Registering for multiple courses will reduce the cost per individual course. Please ask the Admissions Office for more information about the other kinds of discounts we offer and what you can do to receive one.