6. Exploracions

6.3. Prototipatge i proof of concept

Hi ha moltes maneres d’afrontar un prototip i el proof of concept d’un projecte, i en propostes com la d’aquesta assignatura la tria final és molt oberta. Pot ser fins i tot un vídeo explicatiu. Tanmateix, us recomanem que intenteu sempre tenir quelcom que es pugui fer servir, que sigui testable, ja que així podreu transmetre molt millor la idea del tipus d’interactivitat que voleu explorar.

A l’apartat 1, vam definir un prototip com un model d’un producte que permet materialitzar els components bàsics del sistema per poder-ne avaluar el disseny. Però com s’elabora?

Com heu vist en altres assignatures, hi ha molts tipus de prototipatges, tant si ens basem en el mitjà com en la seva fidelitat. En termes generals, podem diferenciar entre prototips de baixa fidelitat o d’alta fidelitat. Tenint en compte que el prototip en si no deixa de ser una versió del projecte amb menys contingut o funcionalitats que el que seria la versió final, un prototip d’alta fidelitat s’assemblarà més al que podria ser un producte acabat.

Us deixem una llista de tipus de prototipatges que podeu fer servir. Aquests són iteratius i, per tant, podeu començar elaborant un prototip en paper per acabar amb uns dissenys molt més refinats i interactius. L’objectiu continuarà sent que el concepte s’entengui de la millor manera possible.

  • Prototipatge en paper: és un esbós d’una interfície que s’elabora sobre paper. Aquest permet avaluar el disseny de manera ràpida i senzilla i, en fases més avançades, definir el disseny final. Aquesta opció és molt útil en el cas de dissenys per a pantalles però pot ser massa senzilla per demostrar l’usabilitat d’altres tipus d’interacció. Tot i així, el paper sempre és el millor punt de partida per provar idees de manera ràpida i efectiva.
    Si voleu dissenyar per a diferents pantalles, us recomanem que utilitzeu quadrícules que us facilitin la feina i us estalviïn temps com ara: Sneak Peek Itz o Sketch Sheets.Quant a altres mitjans, hi ha plantilles com aquesta per a chatbots o aquesta altra per realitat virtual que permeten esbossar diferents opcions per a aquests formats abans de comprometre’s amb un disseny o funcionalitat més definitius.
  • Màgic d’Oz: aquesta tècnica ens permet simular les interaccions dels usuaris sense implementar les funcions del sistema. L’usuari que prova el sistema, té la sensació d’estar interactuant de manera real.
    El dissenyador, per la seva part, observa com interactua l’usuari i contesta, creant la il·lusió que és el sistema, el que està funcionant. Aquesta tècnica pot ser implementada en prototips en paper o en d’altres tipus.
  • Storyboards: és una tècnica importada del cinema i es basa en il·lustracions que representen el context en què l’usuari utilitza el sistema. Cal il·lustrar cada pas, i cada il·lustració mostra les accions de l’usuari, components de la interfície i respostes del sistema. Se solen utilitzar per entendre el flux de l’usuari i com la interfície ha de donar suport a cada pas d’execució de la tasca.
  • High fidelity mock-ups: són representacions molt detallades i refinades del vostre projecte. Inclouen l’estil i els aspectes visuals, com colors o tipografia i, per tant, si s’utilitzen amb eines de prototipatge poden donar la sensació d’estar utilitzant un producte final, sense haver d’implementar les funcions reals.

En el camp del prototipatge, i sobretot el prototipatge en pantalla, hi ha un gran nombre d’eines que podeu fer servir o fins i tot, potser ja n’heu fet servir alguna o teniu alguna preferència. Algunes d’aquestes eines, fins i tot, ja ofereixen plantilles per treballar estils d’interacció més enllà de la pantalla, com realitat virtual o augmentada.

Les més usades avui en dia inclouen Sketch, Figma o Adobe XD, tot i que en podeu trobar moltes més, o fins i tot utilitzar Adobe Photoshop. Moltes d’aquestes eines també permeten crear connexions per mostrar una interacció bàsica. Si no, es poden fer servir eines com InVision, Marvel o ProtoPie. Per veure les eines disponibles, us recomanem anar a la fitxa de l’Interface Toolkit sobre Eines Programari.

En funció de la naturalesa dels vostres projectes, potser us trobeu amb la necessitat de prototipar quelcom de físic, un objecte o artefacte interactiu. Hi ha poques eines que ens permetin prototipar sense necessitat de programar. Si el que voleu és elaborar un prototipatge d’un artefacte interactiu, us recomanem que feu una ullada a Arduino, una plataforma de codi obert per a prototips electrònics. Són dispositius molt fàcils d’aconseguir i amb molta documentació, la qual cosa fa que sigui molt fàcil començar a fer-los servir.

Connectant una placa Arduino a una placa de proves, afegint-hi alguns components (sensors, llums o pantalles) i escrivint una mica de codi podem utilitzar aquesta eina per un munt de coses, des de programar un ventilador perquè s’engegui quan s’arriba a certa temperatura o per què l’Alexa ens recordi alguna cosa quan entrem a casa.

Si bé Arduino requereix una mica de coneixement de programació per fer-lo servir, hi ha eines que ens faciliten la feina. Una d’elles és Blokdots, que per mitjà de blocs de lògica ens permet construir prototips físics interactius sense escriure ni una sola línia de codi. A més, inclou molta documentació i tutorials per començar.

Un altre exemple de microcontrolador, més fàcil d’utilitzar i més econòmic, és el Micro:bit. Aquest es pot programar amb un entorn visual i, segons el tipus de prototip que es vol fer, resulta molt més senzill que Arduino.

Si tot i així, us animeu a programar, hi ha exemples de tutorials que connecten prototips elaborats amb eines com Framer X o ProtoPie amb Arduino i fan possible que els nostres dissenys connectin amb quelcom físic. En aquest article, s’explica com connectar pas a pas un disseny a Framer X. En aquesta altra guia s’explica com fer-ho amb un disseny a ProtoPie.

Tot i així, no és obligatori elaborar un d’aquests prototipatges, sempre que s’elabori d’una altra manera i, per tant, sigui usable i respongui la vostra pregunta de recerca.

El que guiarà quin tipus de prototipatge s’ha de dur a terme serà la naturalesa del vostre projecte i el tipus d’interacció sobre el qual el baseu. Si el projecte es basa en pantalla, prototipar amb un d’aquests programes és ideal, ja que mostra el funcionament i ens permet avaluar-lo.

En canvi, si voleu construir quelcom basat en gestos, us recomanem utilitzar quelcom com Scratch. Aquesta eina de programació amb blocs, permet crear petits programes sense necessitat de programar en codi que fan anar la càmera de l’ordinador per detectar «taques» que es poden interpretar com a gestos. Aquí en tens un petit tutorial.

Com que és difícil fer-ne un prototip sense construir-lo del tot o utilitzar una tecnologia de reconeixement de gestos, si no us sentiu còmodes fent servir Scratch o algun altre programa similar, potser la millor opció és mostrar-ho mitjançant la tècnica del Màgic d’Oz amb un vídeo explicatiu. De la mateixa manera, si voleu construir un agent conversacional, podeu utilitzar una de les eines proposades a l’apartat 2.

Allò que vulgueu construir és el que definirà l’eina que heu de fer servir.