El dissenyador Jesse James Garrett al 2000 va donar a conèixer un diagrama que reull el procés de disseny de l’experiència d’usuari que servís per visualitzar el procés de disseny i poder-ho aplicar al desenvolupament de projectes web.
Actualment el gràfic en 5 capes del DxI és bàsic per entendre com es dissenyen experiències:
Capa 1: Estratègia. Necessitats i objectius. En tot projecte d’interacció és necessari conèixer en profunditat quines són les necessitats dels nostres usuaris i quins són els objectius del nostre producte, per a poder articular quins objectius volem aconseguir amb el projecte. Durant aquesta fase s’utilitzen tècniques de recerca amb les quals poder recopilar i informació que ens pugui resultar
rellevant per a construir els fonaments del nostre disseny de la manera més precisa possible.
Capa 2: Definició. Abast (especificacions funcionals i de contingut). Una cop hem definit quines són les necessitats que volem cobrir i els objectius que el nostre projecte ha d’aconseguir, entrem en una fase en la qual es defineix l’abast del projecte, és a dir, definim les especificacions funcionals i de contingut que ha de cobrir el nostre disseny per a aconseguir el seu objectiu. En aquesta fase s’utilitzen tècniques per a modelar arquetips de persones i escenaris d’ús sobre els quals visualitzar el procés d’interacció amb la finalitat de detectar els requisits tant funcionals com d’informació necessaris per a dur a terme les tasques.
Capa 3: Estructura. Disseny d’Interacció. En aquesta capa és on es dissenya la interacció, és a dir, a partir dels requisits comencem a definir com es comportarà el sistema per respondre a les necessitats de l’usuari. En aquesta capa s’utilitzen tècniques de diagramació i esquemàtica per a determinar
com es presentarà el contingut i en quines seqüències d’acció s’organitzarà per facilitar que la persona usuària pugui completar les seves tasques de manera intuïtiva.
Capa 4: Esquelet. Prototipatge. En aquesta capa es refina l’estructura de la interacció fent-la més concreta. Mitjançant tècniques de prototipatge, s’implementen aspectes concrets de la interacció, com per exemple com permetrem que l’usuari es mogui entre les diferents opcions o com li facilitarem que les pugui accionar. Aquests aspectes de navegació i interfície d’usuari s’implementen de manera esquemàtica encara que amb prou definició per a aplicar-los mètodes d’inspecció i avaluació amb usuaris que ens ajudin a refinar el disseny fins a aconseguir el major nivell de satisfacció d’ús possible.
Capa 5: Superfície. Llenguatge visual i artístic. Finalment, es desenvolupa la capa més sensorial de l’experiència. És la capa on es defineix l’aspecte i es desplega el potencial que té el disseny per a generar emocions. Mitjançant tècniques pròpies del llenguatge visual i artístic, s’apliquen variables de forma, color, textura, composició, moviment i so per construir una interfície capaç de connectar emocionalment amb els nostres usuaris. Aquesta última etapa aconsegueix tal nivell de complexitat que en moltes ocasions es considera el disseny d’interfície una disciplina independent, encara que òbviament està intrínsecament relacionada amb el disseny d’interacció. La darrera capa del DxI ja no la tractarem en aquesta assignatura.