GovernIB / sistra2

Nou component de tramitació electrònica SISTRA2
0 stars 0 forks source link

STT: Maquetació de l'assistent de tramitació #20

Closed sgelabert-dgtic closed 6 years ago

sgelabert-dgtic commented 6 years ago

Es sol·licita la maquetació de l'assistent de tramitació

rsanz-indra commented 6 years ago

Se pasa primera versión de propuesta

sgelabert-dgtic commented 6 years ago

Revisada la maquetació, vos adjuntam proposta de canvis (adjuntem captura de pantalla): 1.- Passes 1,2,..5 passen a formar part de la capçalera i damunt el Títol del tràmit 2.- Es posa fons vermell en la passa on ens trobam (1,2,3,...) i s'afegeix una linia vermella que ens separa les passes (on hi posam el botó eliminar la tramitació) del títol. 3.- El títol de tràmit perd les cometes i es disminueix la mida de la lletra 4.- Es disminueix la mida de les icones i s'aprofita tota la mantalla per les descripcions 5.- Es passa la llegenda de les icones al peu de pàgina, que canvia lleugerament

assistentv3

amaciam-indra commented 6 years ago

Hem revisat la proposta pel que fa a disseny i usabilitat i us fem les observacions següents:

1.- Passes 1,2,..5 passen a formar part de la capçalera i damunt el Títol del tràmit El títol és l'element principal de la tramitació que el usuari està realitzant i les passes estan vinculades a ell, al canviar l’ordre s’inverteix el sentit lògic. Endemés el botó ELIMINAU esborra el tràmit, no les passes. Consideram per tant que aquesta proposta de canvi no és correcta a nivell de disseny semàntic.

2.- Es posa fons vermell en la passa on ens trobam (1,2,3,...) i s'afegeix una linia vermella que ens separa les passes (on hi posam el botó eliminar la tramitació) del títol. Aquí aplica el mateix que s'ha comentat al punt anterior, les passes no tenen més pes que el títol del tràmit i endemés emprar el mateix color que la capçalera trenca completament la maquetació i la seva correcta lectura, ja que s'ajunten capçalera i llista de passes. S'ha de veure com es marquen a nivell visual les passes realitzades a mesura que es vagin completant les passes, tenint en compte que si es van marcant amb el fons vermell s'anirà fusionant la capçalera i la llista de passes, quedant molt estrany a nivell de disseny. D'altra banda, per la pantallada que adjuntau sembla que no està basada en la darrera versió de la maqueta que us hem remes, ja que en la darrera versió s'ha "llevat" de la llista de passes la passa Finalitzar per donar més importància a la passa Registrar, que en realitat és la darrera. Per tant, en tràmits on únicament s'hagi d'emplenar hi haurà només 3 passes (Cal Saber, Emplenar i Registrar), la llista de passes s'aprimarà i es diluirà a nivell d'estil llevant-li la importància que requereix. Si el que es vol és reduir l'amplària de la llista de passes, es podrien estudiar alternatives.

3.- El títol de tràmit perd les cometes i es disminueix la mida de la lletra Les cometes serveixen per emfatitzar la seva posició. Disminuir la lletra pot provocar confusió amb el títol de la passa. Ara són iguals que el títol del tràmit i aquest perd totalment la força que entenem que ha de tenir. En definitiva, queda un disseny excessivament pla al que no es ressalten les parts importants.

4.- Es disminueix la mida de les icones i s'aprofita tota la mantalla per les descripcions 5.- Es passa la llegenda de les icones al peu de pàgina, que canvia lleugerament Les icones s'han ubicat a la dreta per tenir accés a elles immediatament i realment ocupen una amplària bastant reduïda, tot i que es podrien fer encara més petites. Posar les icones al peu de pàgina a més de trencar el disseny dificulta la interpretació de la informació, i consideram que com a molt es podrien sota la llista d'elements. Endemés, si el tràmit tingués més elements el peu de pàgina es perdria.

A partir d'aquests comentaris evidentment la decisió final és vostra, únicament us aconsellam a nivell de disseny i usabilitat des de la nostra experiència. Si voleu que realitzem algunes variacions al disseny proposat per comparar, ens ho comentau.

sgelabert-dgtic commented 6 years ago

Després valorar les vostres indicacions i consensuar amb la DGCOM la imatge de l'assistent, us passem proposta final: 01_verd

rsanz-indra commented 6 years ago

Sobre la propuesta final se aprueban las siguientes cuestiones a añadir:

rsanz-indra commented 6 years ago

Se adapta la maqueta a los últimos cambios. Respecto a la visualización en dispositivos móviles, tal como se indica en el análisis funcional, está optimizado para su uso en tablets aunque es funcional en móviles. Si se quisiera establecer algo específico para móviles habría 2 opciones:

sgelabert-dgtic commented 6 years ago

Es remet, maquetació a la DGCOM per la seva validació (de moment sense resposta). Comentaris DGDT:

rsanz-indra commented 6 years ago

Entendemos que esperamos a tener contestación de DGCOM para realizar modificaciones por si se solicitan nuevos cambios.

Respecto a accesibilidad se podría aplicar un css personalizado para accesibilidad (habría que poner un icono de accesibilidad en algún sitio, p.e. el pie).

Respecto a la dirección en el pie, es configurable por Entidad en Sistrages.

Respecto al cambio de idioma, efectivamente no se permite cambiar de idioma una vez se ha iniciado un trámite puesto que se generan los datos para ese idioma.

Respecto al diseño para móviles tal como se indicaba en el documento de análisis se contemplaban 2 posibles visualizaciones: escritorio y tablet, y para móvil se usaría el modo tablet que es el que sale con el scroll. Como se indicaba hay que determinar si se quiere un modo de visualización propio para móvil y también determinar que se hace con los formularios (llevado al caso extremo implicaría que el diseñador de formularios en STG tuviese un modo para móviles, pero eso ya sería complicar excesivamente el tema también teniendo en cuenta que puede haber componentes de formulario, no implementados en versión inicial de Sistra2, que dificulten su visualización en móvil como lista de elementos). Teniendo todos aspectos en cuenta hay que decidir que se quiere hacer y que va a estar en la versión inicial de Sistra2.

sgelabert-dgtic commented 6 years ago

Acab de tornar a insistir amb DGCOM i aquesta és la seva resposta:

Des del punt de vista del disseny, res a dir quant al color i la resta d’elements gràfics. En conjunt resulta molt fàcil de manejar... Només vull remarcar-te que la font utilitzada és l’Arial, la qual no és, ara com ara, corporativa. En aquest cas, s’hauria de canviar a la Noto Sans (font dels documents administratius, que, a més, en pantalla resulta molt neta i facilita, per tant, la lectura) o a la Trebuchet, que és la que s’usa a la pàgina web. Jo optaria per la Noto, però vosaltres mateixos, segons les possibilitats tècniques.

Respecte a l'accessiblitat em pareix bé la inclusió de la CSS més la icona, però la ubicaria dins la capçalera i no en el peu. L'adreça del peu ens la feren llevar de la resta de frontals, per tant, en la nostra implementació no ha d'aparèixer i, com us indicava, el peu hauria de ser coherent amb la resta de frontals. Pel que fa a l'idioma i al tema mòbil d'entrada ho deixem fora de la primera versió de SISTRA2

rsanz-indra commented 6 years ago

Respecto a la fuente de letra se emplea la que se decidió como corporativa en el MIC, la Bariol (como secundaria Arial). Entiendo que deben de estar probando desde un equipo que no la tiene instalada (igual un Mac). La definición del tipo de letra en la maqueta esta igual que en Webcaib: body { font: normal 100% 'Bariol Regular', Arial, Helvetica, sans-serif; color: #333; background-color: #eaeaea; } Si queréis que se haga cambios respecto a los tipos de letra a usar, confirmarnos los tipos y el orden.

Miramos de maquetar el icono de accesibilidad en la cabecera pero va a estar más justo de espacio que en el pie. Hacemos prueba y os comentamos.

Respecto el pie, lo que aparece en la maqueta como "© Govern Illes Balears C/ De la LLotga 3 - 07012 Palma" es la propiedad "Contacto pie de página (HTML)" que aparece en la pantalla de Configuración de entidad, por lo que quitar la dirección es ya un tema de datos. Respecto a la unificación del pie con el resto de frontales habría que definir que se quiere exactamente para ver como impacta en modelo de datos y pantallas en Sistrages:

sgelabert-dgtic commented 6 years ago

OK al tema fonts (suposava que hauríeu mantingut coherència amb WEBCAIB). En qualsevol cas he demanat confirmació a la DGCOM Ok al tema accessibilitat i adreça del peu. Pel que fa al peu ha de ser igual que el de la Seu Electrònica. Pel que fa els enllaços efectivament haurien de ser mantenibles idealment via pantalla de configuració d'entitat. Pasau-nos els canvis en una nova versió de la maqueta i tanquam ja el disseny.

rsanz-indra commented 6 years ago

Se realizan los cambios solicitados:

sgelabert-dgtic commented 6 years ago

Ok als canvis