MICRO UI – 2026

Projects MA DIGITAL EXPERIENCE DESIGN

MICRO UI – 2026

Micro UI is the term project for the Interface Design introductory module in Term II. It invites students to explore how affordances and micro-animations shape the usability of digital interfaces, by analysing the principles that guide users’ behaviour even before they are aware of them.

Based on a study of the visual and interactive cues that shape user expectations, the project encourages students to design subtle yet effective animations capable of improving feedback, engagement and accessibility. The challenge lies in striking a balance between aesthetics and function, so that movement and affordance work together to create fluid, responsive and meaningful interactions. The course also addresses, as a complementary topic, the issue of ‘dark patterns’ – those same principles misused for the purpose of manipulation rather than guidance.

 

Studio project (2026) with Romain Collaud, Alain Bellet

Assistants
Martial Grin
Students
Delphine Brantschen, Marc Facchinetti, Thomas Neyroud, Youri Zermatten
Know-how
UX/UI, Web

Type Finder

 

Type Finder uses direct manipulation as an alternative to current tools for typeface search, notably font book and foundry lists. An asemic glyph variable on five axes allows designers to sketch the formal characteristics of the font they are looking for, with match results then pulled from the database and ranked according to the sketch. The glyph is meant to escape meaning and serve as a purely formal example. The project aims to help designers fine-tune their typeface research based on key features, namely for type designers conducting reference research. Moreover, it is designed as an instructive experience, helping designers with little knowledge of type design understand the main characteristics of fonts. Contextual component states help build strong affordances that guide the user naturally through the interface. 

Par Thomas Neyroud

Matter Picker

Hold a lens over everyday matter and push in. A loupe follows your cursor and zooms through five scales with no cuts: Matter, Molecules, Structure, Atoms, Atom. Pick a real molecule like caffeine or salt, and dive. Matter dissolves into atoms, atoms snap into a skeleton, one atom unfolds into spinning shells. Every form is earned by the chemistry: an atom's shape is its valence count. No diagrams to memorize. One gesture, zoom, and the hidden architecture of ordinary matter reveals itself. Chemistry you fall into, rather than read.

Par Delphine Brantschen

Correspondances.ch Picker – Map Display

 

correspondances.ch is a website presenting over 3,000 reproductions of brutalist architecture postcards. The current filtering system is limited to a basic faceted index. The new picker can be seen as an extension of the site's existing display modes. Rather than browsing postcards as a list, it allows users to navigate them by their geographic position on a map. With complex zoom transitions across multiple scales and a tag system selectable directly from the images themselves, the prototype enables spatial navigation through a curated selection of 250 Swiss postcards. The intention is to eventually integrate this prototype, scaled to the full 3,000-card worldwide archive, into the live site as part of its next version update.

Par Youri Zermatten

Zermatten_Youri_MicroUI_Mockup_01.png
Facchinetti_Marc_MicroUI_Mockup_01.jpg

Pizzeria Picker

Pizzeria Picker is an interactive mobile tool for creating a precise pizza profile through granular parameters. Users can either use this profile to find pizzerias capable of making their ideal pizza, or evaluate how accurately a pizzeria executes a specific pizza style. A real-time Three.js model visualizes every adjustment and generates a detailed, data-driven result.

Par Marc Facchinetti

Projects related to UX/UI
See more projects

Portfol.io

BA MEDIA & INTERACTION DESIGN

Portfol.io

with David Liebermann, Maximilian Kiepe, Jana Reddemann

Hello World! Goodbye predictable, standardized and interchangeable web. Students questioned the conventions of the digital World, explored the Wide possibilities of the medium, and even invented new approaches to interact with the Web. And what better way to give web design meaning than through the students own portfolios, understood as expressions of attitude and personality. https://websites.ecal-mid.ch/
Ethical, Accessible and Mindful Design

MA DIGITAL EXPERIENCE DESIGN

Ethical, Accessible and Mindful Design

with Irene Pereyra

Ethical, Accessible & Mindful Design is a one-week module that trains students to examine the ethical dimensions of design decisions. Through practice, students learn to design experiences that are inclusive, transparent, and considerate of their broader social impact. This semester, the module took low-vision accessibility as its central design constraint. Working under the brief Goodbye to All …, students were asked to guide a user through a permanent, irreversible, and non-negotiable farewell. Beyond WCAG compliance, the exercise required sustained attention to contrast across all interface states, legible typography, keyboard-only navigation, focus visibility, and layout integrity at both 100% and 300% zoom, without loss of hierarchy or readability.
Enshittification - 2026

BA MEDIA & INTERACTION DESIGN

Enshittification - 2026

with Tibor Udvari

Many platforms degrade over time, shifting from useful tools into manipulative systems. In this workshop, we explore enshittification as a creative method by modifying existing websites or developing small web experiments that exaggerate friction, automation, overload, and disorientation in order to reveal the underlying logics.
Dalia Spichtig – Breaking the Narrative

BA MEDIA & INTERACTION DESIGN

Dalia Spichtig – Breaking the Narrative

by Dalia Spichtig

Breaking the Narrative is an interactive educational web documentary exploring manosphere narratives. Structured in three parts, it examines the three media formats most used by these communities: video, text, and audio, to analyze their communication and dissemination strategies. Through playful interactions, the project raises awareness of the persuasive mechanisms used by the manosphere while exposing the systemic and ideological realities these narratives often conceal. Aimed primarily at young boys, as well as parents, guardians, and educators, Breaking the Narrative provides tools for understanding, critical analysis, and education around these contemporary issues.
Gabriel Polgar – Tenir la rue, imprimer la rue

BA GRAPHIC DESIGN

Gabriel Polgar – Tenir la rue, imprimer la rue

by Gabriel Polgar

In a context marked by the erosion of social rights and the resurgence of far-right discourse, demonstrations are spaces where voices come together and grow stronger. From these gatherings emerges a rare collective energy: words are set free, solidarity is reinforced, and a shared momentum takes hold. Yet this force often fades and disappears far too quickly. Through a web-based design tool grounded in randomness, Tenir la rue, imprimer la rue aims to capture and extend these moments into everyday life. Using collectively gathered and contributed content, this project allows anyone to compose and print their own poster in the street.

Related courses
See all courses

MA DIGITAL EXPERIENCE DESIGN
Nous utilisons des cookies pour collecter des informations sur la manière dont vous utilisez ecal.ch.
Nous utilisons ces informations pour faire fonctionner le site web au mieux et améliorer nos services.