Academic information

Why study this course?

This course is designed to train UX Engineers. The programme is divided into two main parts: user interface (UI) design and front-end development. In the first half of the course, you will dive into the fundamentals of UI design, from wireframing to prototyping and user testing. The second half of the course focuses on front-end development, where you'll learn how to implement your designs using modern technologies like HTML, CSS, and JavaScript, as well as popular frameworks like React. In addition, you'll explore advanced tools like Storybook to effectively document and share UI components.
Mastery of tools and technologies: These courses typically teach the use of specific tools and technologies that are fundamental to the work of a UX Engineer, such as prototyping software, usability testing tools, interface design software, and more. Through the course, you will be able to master these technical tools to carry out your work effectively.
Development of coding skills: A UX Engineer often works on the implementation of user interface designs. Therefore, these courses can teach you relevant coding skills, such as HTML, CSS and JavaScript, so that you can translate UX designs into functional and attractive user interfaces.
Integration with systems and platforms: You'll learn how to integrate your UX designs with existing systems and platforms. This may include understanding APIs, adapting designs for mobile devices and collaborating with development teams to ensure the user experience is consistent across platforms.
Performance optimisation: UX Engineering courses often focus on optimising the performance of user interfaces. You will learn how to identify and solve performance issues that can affect the user experience, such as slow loading web pages or lack of responsiveness of an application.
For UX/UI designers, front-end developers, team leaders and any professional interested in the intersection between design and development. Basic knowledge of web design and development is recommended but not mandatory.

Program aims

Master UI and UX design techniques and tools.
Learn to implement user interfaces using modern technologies and frameworks.
Creation and management of Design Systems.
Become familiar with documentation and collaboration tools such as Storybook.
Develop skills to facilitate effective collaboration between design and development teams.

Professional skills

Upon completion of the UX Engineer course, students will be able to design user interfaces based on usability research and testing. They will master front-end technologies such as HTML, CSS and JavaScript to implement high-fidelity designs. They will also learn how to use versioning tools such as Git and collaborate in Agile environments, ensuring that design solutions are effectively integrated into the product development cycle.

Methodology

Live classes
Practical exercises
Case studies and a final project integrating a complete process
Final project covering all aspects of the course and weekly evaluations to measure progress

Study plan

Module 1: Role of the UX Engineer/UI Developer

Explanation of the Role: Differences and synergies with UI/UX Designers.
Research for UI: benchmarking and testing.
Trends in Design: How to identify and apply current trends.
Mobile First vs Desktop First: Responsive design strategies.

Module 2: UI Design Fundamentals

Colour: Importance and application in UI.
Typography: Selection, combination and effective use.
Grids and Layouts: Principles of composition and structure.
Icons and Images: Selection and optimisation for interfaces.

Module 3: Advanced Tools and Techniques

Flexbox vs CSS Grid: Practical use in real projects.
Design Systems 101: Creation and Maintenance.
Figma and Handoff: Efficiency in transferring designs to development.
iOS, Android vs Web Native Patterns: Differences and best practices.

Module 4: Design Patterns & Best Practices

Navigation and Menus: Efficient and accessible design.
Text Input Controls: UX improvements.
Selection Controls: Use and applications.
Errors, Search and Filters: Design for a better experience.
Lists and Tables: Data visualisation.

Module 5: Specialisation in SaaS UX Design

SaaS Design Principles: Focus on usability and conversion.

Module 6: No Code Tools and Platforms for Designers:

Introduction to No Code tools that facilitate the integration of APIs without the need to write code, empowering designers to create prototypes and final products.

Module 7: Front-end development

CSS Grid and Flexbox: In-depth learning about positioning and layout techniques for responsive design.
Tailwind CSS: Introduction to the CSS framework for faster and more efficient development.

Module 8: Programming Fundamentals for Designers

Introduction to the DOM: How JavaScript interacts with the HTML structure to create dynamic sites.
API management: Use of APIs to enrich interfaces with dynamic and external data.

Module 9: Version control and collaboration

Git and GitHub: Fundamentals and practice for version control and collaborative work in design and development projects.

Module 10: Introduction to accessibility

Fundamentals of accessible design.
Accessible development: Implement coding practices that improve accessibility, such as the use of semantic HTML.
WCAG Guidelines.
ARIA (Accessible Rich Internet Applications) Roles.

Extra Module: Portfolio building: Effective presentation of projects.

*The academic program may be subject to changes in line with the changing demand for specific skills in the market. Your employability is our goal.

UX Engineer/UI Developer Course

Academic information

Study plan

We rub shoulders with the best

Raúl Marín

Alejandro González

Lorena Ramos Pérez