Texto da Intro
Boosting criativity and participation with enhanced low-fi prototypes
Back in 2011, I was challenged to test the usability of a navigation bar for the digital platform Sapo Campus before staging.
When I tried to engage the first 6 participants in actual design practice, I soon realised that none of them was comfortable with sketching and the simple use of paper prototypes was not enough to properly test the usability, lacking the interactivity and feedback of digital mockups.
It was from the identification of the need to encourage the involvement of participants (stakeholders) in usability tests that the concept of low-fidelity modular prototyping emerged, materialized in the iPrototype.
Coluna de imagens
Uma única imagem

Secção principal
Timeline
How it started: a gameboard to design collaboratively
In 2012, I was more than enthusiastic with the opportunity to sketch a full mobile experience from scratch, the Mesh-t — Mobile Museum Guide ⇲ This android application for the Santa Joana Museum, in Aveiro, was sponsored by QREN and developed by the Cetac Media, in DeCA — Aveiro University, in collaboration with Ubiwhere, a tech company. The development team already had an interface concept and an experience flow. The interface was well designed but I felt that some features needed improvement as well as brand identity.
I knew from previous experience working with developers that main changes in the design required general consensus. So, I started to conceptualise a design tool aimed to encourage participation at brainstorm meetings. I came up with a laser engraved game board depicting a navigation tree with holes to be filled with drawable empty cards as well as modular components of graphical interfaces.
The participants were actively engaged in the design process resulting in valuable contributes toward a validated design solution, both in navigation flow and layout.
I knew from previous experience working with developers that main changes in the design required general consensus. So, I started to conceptualise a design tool aimed to encourage participation at brainstorm meetings. I came up with a laser engraved game board depicting a navigation tree with holes to be filled with drawable empty cards as well as modular components of graphical interfaces.
The participants were actively engaged in the design process resulting in valuable contributes toward a validated design solution, both in navigation flow and layout.

A boardgame with a tree navigation for the mesh-t tourism app design

Brainstorming with the boardgame to engage participants in design discussion
-
- Final sketches obtained from the iterations with the modular components by all participants
-
- Modular cardboard components used to rapidly iterate layout possibilities in the context of its related node
-
- Modular cardboard components used to rapidly iterate layout possibilities in the context of handling a smartphone
Secção principal
The project
The iPrototype — A post-digital interface design tool
In late 2012, I joined the Phd Design Program. My main focus was the value of physically handle tools and material in the design process of physical, digital or hybrid post-digital products. Taking advantage of all the work and experiments with low-fi prototypes and the relevance of modular grid design, I conceptualised a modular design tool, following the same principles and techniques I’ve explored before, and named it iPrototype ⇲.
Combining the physical and structural properties of construction kits with low-fidelity prototyping techniques, the aim of this design tool would be to facilitate the productivity, participation and inclusion in the interface design process for education and project purpose. To empower expressivity and participation of stakeholders in a ludic, inclusive and social way, with no regard to drawing skills or previous knowledge of interface design principles and processes.
Sub secção A
Having a modular grid of 8 by 6 for 48 modules, giving 3 functional columns and 4 rows, the designer and participants can iterate a wide range of combinations for 1×1, 1×2, 1×3 … 2×2, 2×3, and beyond.
The final combination can be traced into a wireframe layout that can be used later in the development to render more detailed paper prototypes.
Secção principal
With students
Teaching UX / UI with the iPrototype for fast iteration of possible design solutions
The empirical observation achieved in work sessions suggests benefits for improved exploration, communication and testing of ideas on iterated models; promotion of interpersonal communication, participation and inclusion; and enhanced efficiency in teaching and learning theoretical and practical principles of interaction design on the development of graphical user interfaces.

Design exercises with the iPrototype at DeCA Interaction Design Classroom, 2013

Design exercises with the iPrototype at Flag-Coimbra Webdesign Course, 2014
Secção principal
Future
Moving forward!
From physical to digital prototyping
— iPrototype 2.0
What if you could use the iPrototype to generate functional digital mockups? To have a wide record of online interactive mockups, physically assembled by people you’ve been working with, whether a technical, a potencial user, a client or a friend. Mockups you can customize, that could be shared and continuously improved until moving into production.
Sub secção A
iPrototype: a tangible design tool to support participative interface design practice
by Helder Santos and Professor Nuno Dias, 2013.
Published in 2º Congresso: design, ergonomia e interação humano-computador.
Natal – Rio Grande do Norte, Brasil.