icon icon

Figma – easy interface development and mobile application design

icon

Training process

Training needs analysis

If you have specific requirements regarding the training programme, we will carry out a training needs analysis for you. This will guide us on which aspects of the programme should receive greater emphasis, so that the training programme meets your specific needs.

What will you gain?

icon

Confident Figma workflow - You will learn how to navigate Figma, organize files, pages, and layers, and build a clean project structure, so you can create polished mockups and screens faster and with less confusion.

icon

Stronger UI design skills - You will master tools for creating and editing UI elements, aligning content, masking objects, and using auto layout and grids, so your interfaces become more consistent and responsive.

icon

Your own component system - You will learn how to build assets, components, variants, and shared libraries, so you can reuse elements across screens, speed up design work, and keep larger projects under control.

icon

Consistent design guidelines - You will create color, text, effect, grid, and spacing styles, making it easier to keep a product visually consistent and expand it with new screens without losing design coherence.

icon

Screens for every device - You will design hi-fi views for desktop, mobile, and tablet, apply breakpoints, and use scaling rules, so your interfaces work logically and look right across different screen sizes.

icon

Clear user flow planning - You will practice defining project goals, mapping user flows, and building lo-fi wireframes, so you can shape information architecture early and avoid costly mistakes before visual polish.

icon

Interactive prototypes - You will build prototypes with transitions, microinteractions, and component behaviors, helping you test ideas faster, present concepts more clearly, and evaluate usability with confidence.

icon

Smoother developer handoff - You will learn asset export, the Inspect panel, and how to prepare specs and shareable links, so you can hand designs to developers more clearly and reduce implementation misunderstandings.

Training programme

1. Introduction to working in Figma

  • discussion of the interface and tool layout,
  • working with files and project structure,
  • Pages and organization of large projects,
  • layers and grouping of elements,
  • Frames – a key element of working in Figma.

2. Basic functions and design tools

  • shapes, icons, objects, images,
  • selection, alignment, masking,
  • auto-layout – basics and application,
  • grids (Layout grid) – responsive design.

3. Assets and components

  • Assets – structure, organization, types,
  • components – creation, use, variants,
  • the master–instance principle and good practices,
  • shared component library.

4. Creating Design Guidelines

  • color styles – palette construction, naming,
  • text styles – web and mobile typography,
  • effect styles – shadows, blurs, radii,
  • grids and spacing – building design consistency.

5. Building a library of graphic elements

  • simple UI elements from scratch (buttons, cards, form fields),
  • standardization and scaling of elements,
  • creating a set of icons and layouts.

6. Information architecture and lo-fi design

  • analysis of the project goal and the user,
  • creating a screen map (user flow),
  • lo-fi mockups – diagrams, structures, layouts,
  • preparation for the high-fidelity design.

7. Application screen design (hi-fi)

  • creating desktop, mobile and tablet views,
  • the use of auto-layout in practice,
  • styles vs components – maintaining consistency,
  • screen versioning and change management.

8. Prototyping and animations

  • creating interactive flows,
  • adding transitions and microanimations,
  • defining component behaviors,
  • testing and improving the prototype.

9. Creating versions for different resolutions

  • responsive design,
  • grids and scaling principles,
  • breakpoints and best practices.

10. Teamwork and collaboration in Figma

  • comments and project iteration,
  • real-time collaboration,
  • change history (version history),
  • sharing projects with stakeholders.

11. Export and handoff of projects to developers

  • export of assets (SVG, PNG, PDF, WebP),
  • developer panel (Inspect),
  • specifications for front-end developers,
  • preparation of links and documentation.

What are the prerequisites for participating in the training?

icon

Basic computer skills - You should be comfortable using a computer, a web browser, and common keyboard shortcuts, so you can work smoothly with files, layers, and screens during the exercises.

icon

Basics of digital graphics - It will help if you understand terms like layer, image, text, icon, and resolution, so you can move faster through interface design tasks and screen layout work.

icon

Intro to interface design - You should recognize what buttons, forms, navigation, grids, and screen layouts are, so moving from lo-fi wireframes to more refined hi-fi views feels much easier.

icon

Readiness for design work - You should be ready to analyze user needs, accept feedback, and iterate on your work, because the training includes prototyping, collaboration, and gradual design refinement.