scieee Open visual document viewer

Estratégias de Design Responsivo - Caso de Estudo: EPR Multiplataforma da Glintt Globalcare

Maria de Freitas de Sousa Camps

Abstract

A proliferação de dispositivos móveis de dimensões e resoluções diversas à qual temos vindo a assistir nos últimos anos, trouxe consigo a necessidade de repensar a experiência dos utilizadores no contexto da web. A abordagem responsiva no design para web apresenta-se como uma solução para a esta problemática. Partindo do estudo de padrões de design de diversas bibliotecas de padrões e a metodologia de design centrado no utilizador, o presente trabalho vem delinear estratégias de design responsivo para um caso de estudo pré existente: a aplicação EPR Multiplataforma, da empresa Glintt GlobalCare.

Full text

MESTRADO MULTIMÉDIA - ESPECIALIZAÇÃO EM CULTURA E ARTES ESTRATÉGIAS DE DESIGN RESPONSIVO Caso de Es udo: EPR Mul ipla a o ma da Glin GlobalCa e ! Ma ia!Camps! ! ! ! M 2016 FACULDADES!PARTICIPANTES:! ! !FACULDADE DE ENGENHARIA FACULDADE DE BELAS ARTES FACULDADE DE CIÊNCIAS FACULDADE DE ECONOMIA FACULDADE DE LETRAS ÍNDICE ! ÍNDICE 3 ! LISTA DE FIGURAS 6 ! RESUMO 12 ! ABSTRACT 13 ! AGRADECIMENTOS 14 ! INTRODUÇÃO 15 ! 1 ! CONTEXTUALIZAÇÃO 17 ! 1.1 ! P oje o 17 ! 1.2 ! P oblema e Obje i os da In es igação 17 ! 1.3 ! Me odologia da In es igação 18 ! 1.3.1 ! Na u eza do Es udo: Mé odo e P opósi o 18 ! 1.3.2 ! Técnicas de ecolha e análise de dados 18 ! 1.3.2.1 ! En e is as 19 ! 1.3.2.2 ! Tes es de Usabilidade e sus A aliação da Expe iência do U ilizado 19 ! 1.3.2.3 ! Regis os de U ilização 20 ! 1.3.2.4 ! Técnicas de Amos agem 21 ! 1.3.2.5 ! Es u u a da Disse ação 21 ! 2 ! FUNDAMENTOS TEÓRICOS PARA A RESPONSIVIDADE 23 ! 2.1 ! Design Responsi o 23 ! 2.1.1 ! O que é o Design Responsi o? 23 ! 2.1.2 ! G elha Responsi a 25 ! 2.1.3 ! Imagens e Vídeos Responsi os 27 ! 2.1.4 ! Media Que ies 28 ! 2.2 ! Mobile Fi s 29 ! 2.3 ! Pad ões de Design, Componen es e F amewo ks 33 ! 2.3.1 ! Pad ões de Design 33 ! 2.3.2 ! Linguagens de Pad ões e Biblio ecas de Pad ões 36 ! 2.3.2.1 ! Análise Compa a i a en e Biblio ecas de Pad ões 37 ! 2.3.2.1.1 ! Nome 39 ! 2.3.2.1.2 ! Ranking 39 ! 2.3.2.1.3 ! Con ex o 40 ! 2.3.2.1.4 ! Ilus ação 40 ! 2.3.2.1.5 ! P oblema 42 ! 2.3.2.1.6 ! Fo ças 42 ! 2.3.2.1.7 ! Solução 42 ! 2.3.2.1.8 ! Diag ama 43 ! 2.3.2.1.9 ! Pad ões Relacionados 44 ! 2.3.2.1.10 ! Comen á ios 44 ! 2.3.2.1.11 ! Exemplos de Código 44 ! 2.3.3 ! Componen es de Design 45 ! 2.3.4 ! F amewo ks 46 ! 2.4 ! Design Cen ado no U ilizado 48 ! 2.5 ! Design pa a a Saúde 49 ! 2.6 ! Design e Ino ação 51 ! 3 ! EPR MULTIPLATAFORMA 54 ! 3.1 ! Ap esen ação dos casos de es udo 54 ! 3.2 ! EPR Médico Mul ipla a o ma 57 ! 3.2.1 ! Funcionalidades: Menus Descon ex ualizado e Con ex ualizado 57 ! 3.2.2 ! O ganog ama Funcional EPR Médico Mul ipla a o ma 59 ! 3.3 ! EPR En e magem Mul ipla a o ma 60 ! 3.3.1 ! Funcionalidades: Menus Descon ex ualizado e Con ex ualizado 60 ! 3.3.2 ! O ganog ama Funcional EPR En e magem Mul ipla a o ma 61 ! 3.4 ! Na egação no EPR Mul ipla a o ma 63 ! 3.5 ! Pad ões de Na egação no EPR Mul ipla a o ma 67 ! 3.5.1 ! Con ex o de Na egação 67 ! 3.5.2 ! Menu Pe sis en e 68 ! 3.5.3 ! Menu Deslizan e 69 ! 3.5.4 ! Ba a de Na egação Ho izon al ( opo) 71 ! 3.5.5 ! Ba a de Na egação Ho izon al ( odapé) 72 ! 3.5.6 ! Lis a Ve ical (com ícones) 74 ! 3.5.7 ! I em Ex ensí el 75 ! 4 ! METODOLOGIA 77 ! 4.1 ! Design Cen ado no U ilizado – comp eende os u ilizado es e os seus obje i os 77 4.2 ! Técnicas de Recolha de Dados 78 ! 4.2.1 ! Análise dos Regis os de U ilização 78 ! 4.2.2 ! En e is as 80 ! 4.2.2.1 ! En e is as aos U ilizado es Finais 80 ! 4.2.2.2 ! En e is as aos p o issionais da Glin 81 ! 4.3 ! Ca a e ização das Pe sonas 83 ! 4.3.1 ! Pe sona P imá ia 1 84 ! 4.3.2 ! Pe sona P imá ia 2 85 ! 4.3.3 ! Pe sona secunda ia 86 ! 4.3.4 ! Pe sona Complemen a 87 ! 4.4 ! Ci cui os Selecionados 88 ! 5 ! ESTRATÉGIAS DE RESPONSIVIDADE 89 ! 5.1 ! Tes es de Usabilidade 94 ! 5.1.1 ! Rela ó io do Tes e de Usabilidade | Fase 1 94 ! 5.1.1.1 ! Me odologia 94 ! 5.1.1.2 ! Obje i o do Tes e de Usabilidade 94 ! 5.1.1.3 ! Pa icipan es 94 ! 5.1.1.4 ! Disposi i os 95 ! 5.1.1.5 ! Ci cui o Escolhido 95 ! 5.1.1.6 ! Resul ados Ob idos 96 ! 5.1.1.7 ! Inqué i o Sys em Usabili y Scale (SUS) 97 ! 5.1.2 ! Rela ó io do Tes e de Usabilidade | Fase 2 101 ! 5.1.2.1 ! Me odologia 101 ! 5.1.2.2 ! Obje i o do Tes e de Usabilidade 101 ! 5.1.2.3 ! Pa icipan es 101 ! 5.1.2.4 ! Disposi i os 102 ! 5.1.2.5 ! Ci cui o escolhido 102 ! 5.1.2.6 ! Resul ados Ob idos 102 ! 5.1.2.7 ! Inqué i o Sys em Usabili y Scale (SUS) 104 ! 5.2 ! Wi e ames Finais 108 ! 6 ! CONCLUSÃO 116 ! 6.1 ! Sa is ação dos Obje i os 116 ! 6.2 ! Limi ações e T abalho Fu u o 117 ! BIBLIOGRAFIA 118 ! ANEXOS 122 ! Anexo 1: Tabela Compa a i a en e Biblio ecas de Pad ões 123 ! Anexo 2: Tabela da Solução Clínica EPR Mul ipla a o ma 125 ! Anexo 3: O ganog ama Funcional EPR Médico Mul ipla a o ma 127 ! Anexo 4: O ganog ama Funcional EPR En e magem Mul ipla a o ma 129 ! Anexo 5: En e is as aos p o issionais da Glin 131 ! Anexo 6: Ci cui os Selecionados 140 ! Anexo 7: Wi e ames Finais 145 ! LISTA DE FIGURAS Fig. 1 Vá ias dimensões de ec ãs de di e en es disposi i os ( e i ada de Responsi e Design, Pa e ns and P inciples, 2015). 24 Fig. 2 Exemplo de layou esponsi o ( e i ada de A Lis Apa : Responsi e Web design, 2010). 26 Fig. 3 Vá ias esoluções de ec ãs ( e i ada de Responsible Responsi e Design, 2014). 27 Fig. 4 Pon os de queb a do layou e na egação do The Bos on Globe ( e i ada de Responsible Responsi e Design, 2014). 29 Fig. 5 Ilus ação do pad ão S ai Sea s de A Pa e n Language, 1977. 34 Fig. 6 Fo og a ia ilus a i a do pad ão S ai Sea s de A Pa e n Language, 1977. 34 Fig. 7 Exemplo de es u u a de pad ão de ui-Pa e ns, 2007. 40 Fig. 8 Exemplo de o og a ia e diag ama ilus a i os de A Pa e n App oach o In e ac ion Design, 2000. 41 Fig. 9 Exemplo de ilus ação de In o Design Pa e ns, 2008. 41 Fig. 10 Exemplo de diag ama de Design Pa e ns, 1995. 44 Fig. 11 Websi e esponsi o da emp esa Vox Media em di e en es disposi i os ( e i ada de Responsi e Design – Pa e ns and P inciples, 2015). 47 Fig. 12 Esquema-sín ese da aplicação EPR Mul ipla a o ma (p oduzida pela au o a). 55 Fig. 13 Ec ã de au en icação na aplicação EPR Mul ipla a o ma em Desk op (p oduzida pela au o a). 57 Fig. 14 Ec ã descon ex ualizado do médico na aplicação EPR Médico Mul ipla a o ma em Desk op (p oduzida pela au o a). 58 Fig. 15 Ec ã Con ex ualizado na aplicação EPR Médico Mul ipla a o ma em Desk op: lis a de doen es, na qual um doen e es á selecionado (p oduzida pela au o a). 58 Fig. 16 Acesso ao ec ã con ex ualizado do doen e na aplicação EPR En e magem Mul ipla a o ma em Desk op – Lis a de Doen es (p oduzida pela au o a). 60 Fig. 17 Ec ã descon ex ualizado do en e mei o na aplicação EPR En e magem Mul ipla a o ma em Desk op (p oduzida pela au o a). 61 Fig. 18 Hie a quia da na egação na e en e Médico da aplicação EPR Mul ipla a o ma, em Desk op (p oduzida pela au o a). 63 Fig. 19 As uncionalidades p incipais p esen es no ec ã an e io , são subs i uídas pelas uncionalidades con ex ualizadas do doen e (p oduzida pela au o a). 64 Fig. 20 Hie a quia da na egação na e en e Médico da aplicação EPR Mul ipla a o ma, em Table (p oduzida pela au o a). 65 Fig. 21 Ec ã descon ex ualizado na e en e en e magem, em Table e ical e ho izon al (p oduzida pela au o a). 65 Fig. 22 Con ex o da Na egação na e en e médico do EPR Mul ipla a o ma (p oduzida pela au o a). 67 Fig. 23 Con ex o da Na egação no websi e do The Gua dian UK ( e i ada de Designing o Touch, 2015). 68 Fig. 24 Menu Pe sis en e na e en e médico do EPR Mul ipla a o ma (p oduzida pela au o a). 68 Fig. 25 Menu Pe sis en e no websi e do designe Rich B own ( e i ada de h p://www. ichb own.in o). 69 Fig. 26 Menu Deslizan e na e en e En e magem da aplicação EPR Mul ipla a o ma (p oduzida pela au o a). 69 Fig. 27 Exemplo de menu deslizan e no acesso ao Mail no iPad a a és de um ges o swipe ( e i ada de Designing o Touch, 2015). 70 Fig. 28 Ba a de na egação ho izon al de opo na aplicação EPR Mul ipla a o ma, e en es médico desk op e en e magem em able e ical (p oduzida pela au o a). 71 Fig. 29 Exemplo de ba a de na egação ho izon al ( opo) na aplicação Li es eam ( e i ada de h ps://li es eam.com) 72 Fig. 30 Ba a de na egação ho izon al de odapé na aplicação EPR Mul ipla a o ma, e en e médico em able ho izon al (p oduzida pela au o a). 72 Fig. 31 Exemplo de ba a de na egação ho izon al ( odapé e opo) na aplicação Facebook, espe i amen e pa a iOS e And oid ( e i ada de Designing o Touch, 2015). 73 Fig. 32 Exemplo de lis a e ical (com ícones) na e en e de en e magem da aplicação EPR Mul ipla a o ma (p oduzida pela au o a). 74 Fig. 33 Exemplo de lis a e ical no websi e The Session ( e i ada de Designing o Touch, 2015). 75 Fig. 34 Exemplo de i em ex ensí el na aplicação EPR Mul ipla a o ma (p oduzida pela au o a). 75 Fig. 35 Exemplo de í em ex ensí el na biblio eca de pad ões de Designing Mobile In e aces, 2011. 76 Fig. 36 Exemplos de esquissos ela i os ao desenho dos ec ãs pa a sma phone (p oduzida pela au o a). 78 Fig. 37 Quan idade de egis os de u ilização po uncionalidade, no EPR En e magem (p oduzida pela au o a). 79 Fig. 38 Quan idade de egis os de u ilização po uncionalidade, no EPR Médico (p oduzida pela au o a). 80 Fig. 39 Exemplo de ec ã do EPR En e magem na ecnologia O acle Fo ms. 82 Fig. 40 Exemplo de ec ã do EPR Médico na ecnologia D.Ne . 82 Fig. 41 Pe sona P imá ia 1 (p oduzida pela au o a). 84 Fig. 42 Pe sona P imá ia 2 (p oduzida pela au o a). 85 Fig. 43 Pe sona Secundá ia (p oduzida pela au o a). 86 Fig. 44 Pe sona Complemen a (p oduzida pela au o a). 87 Fig. 45 Os polega es são os dedos mais u ilizados na in e ação com sma phones ( e i ada de Designing o Touch, 2015). 89 Fig. 46 Zonas acessí eis pelos polega es em ec ãs de di e en es dimensões ( e i ada de Designing o Touch, 2015). 90 Fig. 47 Zona indicada pa a localiza os con olado es em iOS e And oid. Exemplo da aplicação do Facebook ( e i ada de Designing o Touch, 2015). 90 Fig. 48 Exemplo de na egação p incipal escondida num bo ão de menu, no websi e The Session ( e i ada de Designing o Touch, 2015). 91 Fig. 49 Exemplo de na egação p incipal la e al, na aplicação do Twi e ( e i ada de Designing o Touch, 2015). 92 Fig. 50 Á eas acessí eis, espe i amen e nos able s, híb idos e comuns aos dois ipos de disposi i os ( e i ada de Designing o Touch, 2015). 93 Fig. 51 Pe da de con ex o de na egação no sma phone. 96 Fig. 52 Pe da de con ex o de na egação no able e ical. 97 Fig. 53 Pode ia usa es a aplicação equen emen e (p oduzida pela au o a). 97 Fig. 54 Achei a aplicação desnecessa iamen e complexa (p oduzida pela au o a). 98 Fig. 55 Achei que a aplicação e a ácil de usa (p oduzida pela au o a). 98 Fig. 56 I ia p ecisa do apoio de um écnico pa a se capaz de u iliza a aplicação (p oduzida pela au o a). 98 Fig. 57 Achei que as á ias unções da aplicação es a am bem in eg adas (p oduzida pela au o a). 99 Fig. 58 Pa eceu-me ha e mui a inconsis ência na aplicação (p oduzida pela au o a). 99 Fig. 59 Imagino que a maio ia das pessoas i ia ap ende a u iliza es a aplicação mui o apidamen e (p oduzida pela au o a). 99 Fig. 60 Achei a aplicação mui o complicada de usa (p oduzida pela au o a). 100 Fig. 61 Sen i-me mui o con ian e ao usa a aplicação (p oduzida pela au o a). 100 Fig. 62 P ecisa a de ap ende bas an e an es de pode começa a usa a aplicação (p oduzida pela au o a). 100 Fig. 63 Melho ia signi ica i a no con ex o de na egação em sma phone (p oduzida pela au o a). 103 Fig. 64 Uma ez selecionada a “No a Clínica 1”, os u ilizado es demons a am di iculdade em ol a pa a a lis a "No as Clínicas". 103 Fig. 65 Pode ia usa es a aplicação equen emen e (p oduzida pela au o a). 104 Fig. 66 Achei a aplicação desnecessa iamen e complexa (p oduzida pela au o a). 104 Fig. 67 Achei que a aplicação e a ácil de usa (p oduzida pela au o a). 104 Fig. 68 I ia p ecisa do apoio de um écnico pa a se capaz de u iliza a aplicação (p oduzida pela au o a). 105 Fig. 69 Achei que as á ias unções da aplicação es a am bem in eg adas (p oduzida pela au o a). 105 Fig. 70 Pa eceu-me ha e mui a inconsis ência na aplicação (p oduzida pela au o a). 105 Fig. 71 Imagino que a maio ia das pessoas i ia ap ende a u iliza es a aplicação mui o apidamen e (p oduzida pela au o a). 106 Fig. 72 Achei a aplicação mui o complicada de usa (p oduzida pela au o a). 106 Fig. 73 Sen i-me mui o con ian e ao usa a aplicação (p oduzida pela au o a). 106 Fig. 74 P ecisa a de ap ende bas an e an es de pode começa a usa a aplicação. 107 Fig. 75 P opos a pa a a página de login da aplicação EPR Mul ipla a o ma, nos di e en es disposi i os (p oduzida pela au o a). 108 Fig. 76 A na egação global no sma phone é escondida e e elada, quando necessá io (p oduzida pela au o a). 109 Fig. 77 Localização da na egação global do nos di e en es disposi i os (p oduzida pela au o a). 110 ESTRATÉGIAS DE DESIGN RESPONSIVO! 16! p ojeção de um no o layou (Ma co e 2010). ESTRATÉGIAS DE DESIGN RESPONSIVO! 17! 1 CONTEXTUALIZAÇÃO 1.1 P oje o P e endemos desen ol e um es udo ap o undado sob e os p oblemas encon ados nos casos de es udo GlobalCa e (a aplicação EPR Mul ipla a o ma) e encon a possí eis soluções pa a a ingi a esponsi idade, melho ando a expe iência do u ilizado nas pla a o mas. Pa a isso, i emos p ocede à analise das amewo ks exis en es e assim delinea uma es a égia global pa a a ingi a esponsi idade. O esul ado dessa pesquisa ma e ializa-se na p odução amewo ks esponsi as ao ní el dos wi e ames. 1.2 P oblema e Obje i os da In es igação A p esen e p opos a em como p incipal obje i o encon a soluções possí eis pa a esol e a ca ência de esponsi idade dos casos de es udo, dois módulos GlobalCa e. As ques ões ge ais da in es igação passam pela comp eensão dos p oblemas de design no con ex o da saúde; pela análise da expe iência do u ilizado da GlobalCa e; pela ca ac e ização dos u ilizado es inais da GlobalCa e; inalmen e, p e endemos p oduzi amewo ks mais adequadas aos módulos em causa. As p incipais ques ões da in es igação deb uçam-se na p ocu a da elação ideal en e os componen es da in e ace e o es an e con eúdo do na egado ; na comp eensão da hie a quia dos con eúdos de aco do com os di e en es amanhos de na egado es, endo semp e como oco a o ganização da es u u a da na egação. Os obje i os especí icos des e abalho são: • in es igação sob e compo amen os pad ão pa a o digi al (de inição e iden i icação de pad ões de design dos ci cui os do EPR Mul ipla a o ma es udados, endo como oco a na egação); • desen ol imen o e in es igação em e amen as e amewo ks pa a a esponsi idade, aplicadas aos módulos GlobalCa e; • de inição de es a égias de ges ão de mudança. ESTRATÉGIAS DE DESIGN RESPONSIVO! 18! Num p imei o momen o, p ocedemos ao es udo exaus i o do concei o de design esponsi o; seguidamen e, à elabo ação de en e is as a uma amos a da comunidade de u ilizado es inais da pla a o ma em causa, endo em is a a comp eensão das suas necessidades; pa alelamen e, analisamos os dados ela i os aos egis os de u ilização do EPR Mul ipla a o ma; inalmen e, baseando-nos nas in o mações ecolhidas, p ocedemos à ealização de amewo ks esponsi as pa a os módulos GlobalCa e. 1.3 Me odologia da In es igação 1.3.1 Na u eza do Es udo: Mé odo e P opósi o Op ámos po u iliza um mé odo mis o, pelo que a p esen e in es igação em um ca á e simul aneamen e quali a i o e quan i a i o. A pa i de uma pequena amos a de u ilizado es dos casos de es udo, p e endemos ecolhe um conjun o de dados ela i os à esponsi idade dos p odu os es udados. Tal possibili a-nos desen ol e concei os e chega à comp eensão de enómenos a pa i de pad ões p o enien es da ecolha de dados, le ando a cabo uma abo dagem quali a i a. Simul aneamen e, a a és da análise de dados ela i os aos egis os de u ilização do EPR Mul ipla a o ma, p e endemos ecolhe um conjun o de dados numé icos, pe mi indo-nos iden i ica quais as uncionalidades mais u ilizadas nos casos de es udo. Des a o ma, le amos a cabo uma abo dagem quan i a i a. Rela i amen e ao p opósi o do p esen e abalho, si ua-se no âmbi o de In es igação e Desen ol imen o, dada a sua na u eza eó ico-p á ica. 1.3.2 Técnicas de ecol ha e anál ise de dados Na ecolha de dados, i emos eco e a écnicas de ca á e quali a i o (en e is as e es es de usabilidade) e quan i a i o (análise dos dados ela i os aos egis os de u ilização do EPR Mul ipla a o ma). O obje i o é euni a maio di e sidade de in o mação possí el, en iquecendo a nossa ecolha. Des a o ma, p e endemos comp eende as necessidades eais da amos a em causa: a comunidade de p o issionais de saúde que u ilizam o EPR Mul ipla a o ma. Na análise de dados ecolhidos a a és dos egis os de u ilização, i emos ESTRATÉGIAS DE DESIGN RESPONSIVO! 19! u iliza a e amen a Excel. P ocu amos iden i ica e desc e e compo amen os de usabilidade po pa e dos u ilizado es inais, assim como obje i os p esen es nos p ocessos implemen ação e de design dos p odu os em causa. Des a o ma, espe amos encon a conco dâncias e disco dâncias en e os dois polos, pa a se mos capazes de iden i ica pon os de melho ia na esponsi idade dos p odu os. A u ilização das e e idas écnicas acompanha odo o p ocesso de in es igação: Os mé odos de pesquisa são a amen e u ilizados pa a uma única ase – es es são epe idos, pe mi indo cons ui uma base mais sólida de conhecimen o, aplicá el a cada obje i o (Jones 2013).2 1.3.2.1 En e is as Uma das écnicas que u ilizamos é a en e is a, pois pe mi e-nos comp eende com maio de alhe a pe spe i a do u ilizado . No malmen e são ei as no local onde o u ilizado usa o so wa e e podem se es u u adas – com um conjun o p é- de inido de pe gun as – ou não es u u adas. Es e ipo écnica é bas an e lexí el (Tidwell 2010). Das duas ipologias, op ámos po u iliza a écnica da en e is a es u u ada, o ien ando o u ilizado de o ma a consegui ex ai um conjun o de in o mações especí icas ace ca da u ilização do EPR Mul ipla a o ma. 1.3.2.2 Tes es de Usabilidade e sus A aliação da Expe iência do U ilizado Ou a écnica mui o popula nes e con ex o é a elabo ação de es es de usabilidade. Os u ilizado es são obse ados ao mesmo empo que en am execu a uma de e minada a e a. Pa a isso, é-lhes pedido que execu em a e as ípicas do p odu o em causa, de o ma a que possamos de e a e co igi coisas que o con undam ou us em. Seguidamen e, são ano adas as di iculdades demons adas pelos u ilizado es. Os es es de em se ealizados numa ase inicial de p oje o (K ug 2 TA: “Resea ch me hods a e a ely conduc ed once jus o a single phase — hey a e epea ed o build a deepe base o knowledge applicable o each pu pose (Jones 2013).” ESTRATÉGIAS DE DESIGN RESPONSIVO! 20! 2014). A comunidade de design em indo a ques iona -se ace ca dos bene ícios de uma me odologia al e na i a aos es es de usabilidade – a a aliação da expe iência do u ilizado . Na e dade, ambas êm p ós e con as (K ug 2014). No li o Don´ Make Me Think, S e e K ug (2014) de ende a impo ância de elabo a es es de usabilidade. O au o a i ma que es a unciona semp e e que a é mesmo o pio es e com o u ilizado e ado pode da -nos boas pis as pa a melho a um si e e p oduz semp e esul ados posi i os. No a igo, How o Do a UX Re iew, Joe Leech abo da es a ques ão. Apesa de da p e e ência ao mé odo de es es de usabilidade, o au o apon a os bene ícios da a aliação da expe iência do u ilizado em elação ao ou o mé odo: os são esul ados mais ápidos, o cus o é meno do que o dos es es de usabilidade e é mais ácil chega aos u ilizado es (2015). No a igo The My h o Usabili y Tes ing, Robe Hoekman J de ende uma isão opos a à de K ug. O au o e e e que os es es de usabilidade são bons po á ios mo i os, mas não pa a de e mina as p io idades de uma equipa, a i mando que es a écnica alha comple amen e na iden i icação de p oblemas. An es, supo am a obse ação do compo amen o humano, sus en ando os ins in os dos designe s pa a alida ideias de design (Hoekman 2009). Das duas abo dagens an e io men e e e idas, a ealização de es es de usabilidade pa ece-nos se a mais pe inen e pa a o p esen e es udo. 1.3.2.3 Regis os de U ilização Depa ámo-nos com a impossibilidade de ealiza inqué i os aos u ilizado es numa escala signi ica i a, pois não hou e ece i idade po pa e das ins i uições de saúde em causa. Assim, os dados numé icos que sus en am a nossa análise são u o dos dados o necidos pelos egis os de u ilização do EPR Mul ipla a o ma, disponibilizados pelo Hospi al da CUF Po o (no que e e e à e en e EPR En e magem) e pelo Hospi al de Vila F anca de Xi a ( e en e EPR Médico). ESTRATÉGIAS DE DESIGN RESPONSIVO! 21! 1.3.2.4 Técni cas de Amos agem Rela i amen e às écnicas de amos agem, eco emos ao uso de mé odos p obabilís icos, assegu ando que a amos a selecionada é ep esen a i a dos u ilizado es inais da GlobalCa e. Pa a isso, são analisados egis os de u ilização do EPR En e magem no Hospi al da CUF do Po o, e e en es ao pe íodo de 1 a 15 de Ma ço de 2016. Pa alelamen e, são analisados os egis os de u ilização do EPR Médico, ex aídos no Hospi al de Vila F anca de Xi a, en e Janei o e Junho de 2015. 1.3.2.5 Es u u a da Disse ação Pa a além da in odução, seguida pelo p esen e capí ulo da con ex ualização, a p esen e disse ação con ém mais cinco capí ulos. No capí ulo 2 Fundamen os Teó icos pa a a Responsi idade, são desc i os os undamen os eó icos e isuais que sus en am o abalho u u o. São explicados os p incipais concei os necessá ios à comp eensão do que é o design esponsi o, os pad ões de design, a me odologia de design cen ado no u ilizado , a elação en e design e ecnologia e, inalmen e, o design no âmbi o da saúde. No capí ulo 3 EPR Mul ipla a o ma, são ap esen ados os casos de es udo: e en es Médico e En e magem do EPR Mul ipla a o ma, as suas uncionalidades a as es u u as hie á quicas que os o ganizam. Seguidamen e, analisamos o uncionamen o da sua na egação e iden i icamos os seus pad ões de design ao ní el da na egação. Finalmen e, são iden i icadas as e amen as ecnológicas p esen es nos mesmos. No capí ulo 4 Me odologia, é desc i a a me odologia que sus en a a componen e p á ica do abalho. Inicialmen e, é ap esen ado o concei o de Design Cen ado no U ilizado ; seguidamen e, são desc i as as écnicas de ecolha de dados u ilizadas e, po im, a ca a e ização das pe sonas e dos p incipais ci cui os iden i icados. O capí ulo 5 Es a égias de Responsi idade, consubs ancia-se na aplicação dos conhecimen os p e iamen e adqui idos aos casos de es udo, a a és da delineação de es a égias globais pa a a esponsi idade e da p odução de amewo ks esponsi as. Seguidamen e, no capí ulo 6 Conclusão, são desc i as as p incipais conclusões ESTRATÉGIAS DE DESIGN RESPONSIVO! 22! ob idas na p esen e in es igação, assim como as possibilidades de abalho u u o. As úl imas duas secções cons i uem, espe i amen e, a bibliog a ia e os anexos. ESTRATÉGIAS DE DESIGN RESPONSIVO! 23! 2 FUNDAMENTOS TEÓRICOS PARA A RESPONSIVIDADE 2.1 Design Responsi o 2.1.1 O que é o Design Responsi o? O g ande aumen o do núme o de pessoas que in e agem com si es e aplicações a a és de able s e ele ones ob igou os designe s a p oje a co e amen e e de uma o ma ap op iada pa a uma ampla a iedade de amanhos de ec ãs. A abo dagem con empo ânea pa a lida com a di e sidade de amanhos de ec ãs é comummen e denominada de design esponsi o (Coope , Reinmann, and C onin 2007).3 Em meados do séc. XX, os designe s g á icos Jan Tschichold, Emil Rude , e Jose Mülle -B ockmann popula iza am o concei o de g elha ipog á ica, um sis ema acional de colunas e linhas, a pa i do qual os módulos de con eúdo se o ganizam. No seu li o, G id Sys ems in G aphic Design, Mülle -B ockmann e e e: “A g elha di ide um plano bidimensional em campos meno es e um espaço idimensional em compa imen os meno es (...) A g elha de ine a dimensão cons an e do espaço (1961)”, adequando as p opo ções da g elha ao amanho de um pedaço de papel em b anco. Des a o ma, o au o p e endia acili a o p ocesso de abalho dos designe s. O sis ema de g elha des ina-se a o nece ao designe um ins umen o de abalho p á ico, ajudando-o a lida com p oblemas isuais e a esol ê-los em e mos de conceção, o ganização e design, com maio elocidade e con iança (Mulle - B ockmann 1961). 3 TA: “The huge ise o people in e ac ing wi h websi es and applica ions on able s and phones has made i c i ical ha designs ende g ace ully and p ope ly on a wide a ie y o sc een sizes. The con empo a y app oach o handling hese di e en sc een sizes is commonly called esponsi e design (Coope , Reinmann, and C onin 2007).” ESTRATÉGIAS DE DESIGN RESPONSIVO! 24! Fig. 1 Vá ias dimensões de ec ãs de di e en es disposi i os ( e i ada de Responsi e Design, Pa e ns and P inciples, 2015). O concei o de g elha ipog á ica oi pos e io men e ap op iado pela disciplina de Web Design, mas com uma di e ença undamen al: a inexis ência de uma página eal. O concei o de Design Responsi o pa a Web e e a sua o igem em 2004 quando o designe e p og amado Came on Adams, au o do a igo Resolu ion Dependen Layou (2004), demons ou pela p imei a ez o exemplo de um layou de um si e que se adap a a à la gu a do na egado . Em 2008, uma sé ie de e mos elacionados, como esponsi o, líquido, luido e elás ico começa am a se u ilizados pa a desc e e layou s. No a igo Responsi e Web Design (2010), E han Ma co e in oduz o concei o de Design Responsi o pa a Web. A a és da obse ação de um conjun o amplo de es a égias eme gen es, o au o iden i icou uma es a égia subjacen e que, uma ez nomeada, se o nou uma e e ência na á ea (Lea y 2010). Ma co e se e-se do exemplo da a qui e u a in e a i a como supo e eó ico, adap ando esse concei o ao design pa a Web. Pa a isso, az e e ência aos au o es de In e ac i e A chi ec u e, Michael Fox e Miles Kemp que desc e em uma abo dagem adap a i a, em que o habi an e e a es u u a se in luenciam mu uamen e (Ma co e 2010). O au o des aca ês elemen os essenciais no e e ido p ocesso me odológico: 1) um layou baseado numa g elha esponsi a; 2) imagens esponsi as; 3) media que ies.4 E han Ma co e e e e a impo ância e u gência de uma abo dagem esponsi a no desen ol imen o de design pa a a Web. Em luga da c iação de p oje os 4 Media que ies5 são um módulo especí ico do CSS que pe mi e que o con eúdo se adap e à ela do disposi i o que es á a se u ilizado (nomeadamen e às ca ac e ís icas de de inição da mesma) (Ma co e 2010). ESTRATÉGIAS DE DESIGN RESPONSIVO! 25! disconexos, o au o de ende que as di e en es e sões de um de e minado websi e de em aze pa e da mesma expe iência cogni i a. Pa a isso, o websi e de e se lexí el e adap á el aos di e en es disposi i os (Ma co e 2011). 2.1.2 G elha Responsi a Depois de alguns minu os de e lexão sob e a g elha esponsi a, os bene ícios o nam-se cla os: os designe s ganham uma amewo k acional e es u u ada pa a o ganiza em os con eúdos e os u ilizado es ganham si es legí eis e bem o ganizados (Ma co e 2009).5 A p opósi o do p ocesso de abalho com a g elha esponsi a aplicada ao webdesign, Ma co e e e e que quando pensamos em esponsi idade, p ecisamos de aduzi o design pa a algo mais luído, mais p opo cional (Ma co e 2011). Também T en Wal on de ende a mesma isão, a i mando que ao usa mos g elhas esponsi as, imagens esponsi as e media que ies es amos a cons ui , mais do que uma página, uma ede de con eúdo que pode se eo ganizada em qualque na egado , pa a melho ansmi i uma mensagem. Em ez de pixeis, usamos Viewpo -pe cen age leng hs, compos as pelas w e h. Des a o ma, o co po de ex o o na-se p opo cional ao amanho da janela de exibição. Uma unidade w co esponde a 1% da janela de exibição, pelo que pa a ob e mos a la gu a o al da mesma emos que usa 100 w (Allen 2014). Depois de a ibui mos esponsi idade ao co po do ex o, passamos pa a a g elha. Pa a isso, Ma co e e e e que podemos aplica o mesmo ipo de pensamen o de p opo cionalidade usado no edimensionamen o do ex o, ao layou (Ma co e 2011). Na sua mais ecen e ob a, Responsi e Design: Pa e ns and P inciples, Ma co e, ale a pa a a impo ância de p ocu a mos pe cebe p o undamen e como e po quê um de e minado elemen o de e adap a -se, alegando que de emos pa a de pensa em e mos de colunas e linhas e começa mos a ala da qualidade dos nossos designs esponsi os (Ma co e 2015). 5 TA: “A e a ew minu es o g iddy hinking, he bene i s become clea : designe s gain a a ional, s uc u ed amewo k o o ganizing con en and use s gain well-o ganized, legible si es (Ma co e 2009).” ESTRATÉGIAS DE DESIGN RESPONSIVO! 32! caó ica do u ilizado pelo seguin e: um mul i- ouchsc een gigan e e de al a- esolução, um sis ema ope a i o que especi ica con olos sc een- ouch g andes o su icien e pa a se em usados com sucesso; um conjun o de in e aces ges uais (hoje icónicas) áceis de descob i e ap ende ; um conjun o de senso es que e elam in o mação con ex ual sob e a o ien ação, localização, luz ambien e, e mo imen o, o que eio adiciona um ex ao diná io ní el de in eligência a uma no a ge ação de aplicações mó eis (Coope , Reinmann, and C onin 2007).14 A expe iência do u ilizado melho a subs ancialmen e com a adoção da abo dagem mobile i s . Em ez de duas e sões sepa adas, as duas e sões do mesmo si e ou aplicação passam a cons i ui uma expe iência coe en e. Segundo W oblewski, a combinação das expe iências pa a disposi i os mó eis e pa a desk op esul a em u ilizado es mais iéis aos dois ipos de disposi i os. O au o ilus a a sua a i mação, dando o exemplo do Facebook, que não pensa na expe iência pa a disposi i os mó eis como pa e do si e; an es, comp eende-a como uma o ma de melho a a in ei a expe iência do Facebook (W oblewski 2011). Pa alelamen e à isão de W oblewski, Ka en McG ane em e o ça a ideia de que os con eúdos dos di e en es disposi i os de em es a em conco dância, quando a i ma, na sua ob a Con en S a egy o Mobile, que a es a égia do con eúdo pa a disposi i os mó eis não de e se pensada como um sa éli e da e são pa a desk op, mos ando apenas o con eúdo que os u ilizado es dos disposi i os mó eis ão p ecisa . Tal não signi ica que o con eúdo de a se ap esen ado da mesma o ma, mas sim que a expe iência de e se a mesma (McG ane 2012). 14 TA: “The mobile de ice use expe ience changed o e e in June o 2007, when Apple in oduced he iPhone. Almos o e nigh , he de ini ion o wha i mean o be a mobile in o ma ion de ice expe ienced a adical eboo . (…) The iPhone eplaced his mess o a use expe ience wi h he ollowing: A gian , high- esolu ion, mul i- ouchsc een, an OS ha speci ied on-sc een con ols big enough o inge s o use success ully A se o now-iconic ges u al idioms ha we e ela i ely easy o disco e and lea n A se o senso s deli e ing con ex ual in o ma ion abou o ien a ion, loca ion, ambien ligh , and mo emen ha added an ex ao dina y le el o in elligence o a new gene a ion o mobile apps (Coope , Reinmann, and C onin 2007).” ESTRATÉGIAS DE DESIGN RESPONSIVO! 33! 2.3 Pad ões de Design, Componen es e F amewo ks Ao longo dos úl imos anos, o deba e em o no do design esponsi o mudou sub ilmen e, concen ando-se, não na conceção das páginas, mas sim nos pad ões: na comp eensão dos pequenos elemen os eu ilizá eis que compõem um sis ema de design maio (Ma co e 2015).15 2.3.1 Pad ões de Design Pad ões de design são soluções desen ol idas a a és da análise e sis ema ização de soluções de design eco en es pa a p oblemas conc e os. Es as soluções não são echadas, podendo se ap op iadas de di e en es o mas na sua aplicação. “Os pad ões de design de em se su icien emen e abs a os pa a se em mais ou menos uni e sais na sua u ilidade, mas ao mesmo empo, especí icos o su icien e pa a e em alguma u ilidade (Ca alhais 2008).”16 O concei o de pad ão de design oi inicialmen e desen ol ido pa a as disciplinas da a qui e u a e do u banismo. No seu li o A Pa e n Language, Ch is ophe Alexande ca a e iza os pad ões como soluções possí eis pa a p oblemas eco en es. Des a o ma, o au o exp essa a elação en e um de e minado con ex o, um p oblema e uma solução. O au o a i ma que cada pad ão desc e e um p oblema que oco e epe idamen e num de e minado con ex o e depois desc e e o âmago da solução pa a esse p oblema, de al o ma que al solução pode se implemen ada inúme as ezes sem que seja usada duas ezes da mesma o ma (1977). 15 TA: “O e he las ew yea s, he con e sa ion a ound esponsi e design has shi ed sub ly, ocusing no on designing pages, bu on pa e ns: unde s anding he small, eusable elemen s ha comp ise a la ge design sys em (Ma co e 2015).” 16 TA: “Design pa e ns should be su icien ly abs ac o be mo e o less uni e sal in i s use ulness, bu simul aneously speci ic enough o be o any use (Ca alhais 2008).” ESTRATÉGIAS DE DESIGN RESPONSIVO! 34! Fig. 5 Ilus ação do pad ão S ai Sea s de A Pa e n Language, 1977. Fig. 6 Fo og a ia ilus a i a do pad ão S ai Sea s de A Pa e n Language, 1977. O concei o oi pos e io men e ado ado pelo design de so wa e. No li o Design Pa e ns, E ich Gamma, Richa d Helm, Ralph Johnson e John Vlissides de inem pad ões como soluções simples e elegan es pa a p oblemas especí icos na p og amação o ien ada a obje os. Os au o es a i mam que os pad ões de design e le em um abalho de desenho e implemen ação que se encon a explíci o na sua o ma, u o do es o ço de designe s e engenhei os, em busca de uma melho eu ilização e lexibilidade nas suas aplicações. Re e em ainda que os pad ões de design cap am es as soluções de uma o ma sucin a e ácil de aplica (Gamma e al. 1994). Qua o anos depois, Jeni e Tidwell desen ol e o mesmo concei o pa a o design de in e ação. A au o a a i ma que cada pad ão de ine um con ex o de uso, um p oblema, um conjun o de o ças17 que apon am pa a di e en es di eções e uma eg a 17 Na sua ob a No es on he Syn hesis o Fo m, Alexande in oduz o concei o de o ças, apliacado à de inição de pad ões. Es e concei o é mais a de ado ado pela disciplina de design. O au o e e e que: “A ideia de um diag ama, ou pad ão, é mui o simples. É um pad ão abs a o de elações ísicas que soluciona um pequeno sis ema de o ças em con li o, sendo independen e de odas as ou as o ças, de odos os diag amas possí eis (Alexande 1973).” TA: “The idea o a diag am, o pa e n, is e y simple. I is an abs ac pa e n o physical ela ionships which esol es a small sys em o in e ac ing and con lic ing o ces, and is independen o all o he o ces, ESTRATÉGIAS DE DESIGN RESPONSIVO! 35! p imá ia sob e como essas o ças podem se esol idas pa a encon a a melho solução pa a um de e minado p oblema. São ambém o necidos bons e maus exemplos de aplicação (Tidwell 1999). No li o A Pa e n App oach o In e ac ion Design, Jan O Bo che s e e e que um pad ão é uma solução comp o ada pa a um p oblema eco en e. Es a dá especial a enção ao con ex o da sua aplicação, às “ o ças” conco en es que de em se equilib adas, assim como às consequências posi i as e nega i as da sua aplicação (2000). Tal como Tidwell, o au o desen ol e o concei o de pad ões pa a design de in e ação. Coope , Reimann e C onin, au o es do li o Abou Face, e e em: “Pad ões de design são o mas de cap u a soluções de design ú eis e gene alizá-las pa a esponde a p oblemas semelhan es (Coope a al. 2014).”18 Os au o es sublinham ainda os bene ícios do uso de pad ões pa a: eduzi o empo e es o ço em no os p oje os; melho a a qualidade de soluções de design; acili a a comunicação en e designe s e engenhei os de so wa e e educa os designe s enquan o p o issionais. Aplicado de o mas di e sas pelas á ias disciplinas que o ado a am, o concei o de pad ões man e e-se semp e como uma solução abe a e pe meá el à in e p e ação de quem o ap op ia e u iliza. Ao mesmo empo, e le e a sis ema ização de p ocessos e mé odos de abalho nas di e en es á eas do sabe : De ac o, não há azão que impeça a exp essão de expe iências, mé odos e alo es de qualque domínio do sabe na o ma de pad ão, desde que esse domínio inclua abalho de design, c ia i idade ou esolução de p oblemas (Bo che s 2000).19 Ainda assim, impo a esal a que exis e uma di e ença impo an e en e pad ões de design consoan e a disciplina pa a a qual são desen ol idos. Po exemplo, se compa a mos os pad ões de design de in e ação e os pad ões de design a qui e ónico. No design de in e ação, os pad ões espondem não só a ques ões es u u ais e de o ganização dos elemen os, mas ambém a ques ões dinâmicas and o all o he possible diag ams (Alexande 1973).” 18 TA: “Design pa e ns a e a means o cap u ing use ul design solu ions and gene alizing hem o add ess simila p oblems (Coope , Reinmann, and C onin 2007).” 19 TA: “Indeed, he e is no eason why he expe ience, me hods, and alues o any applica ion domain canno be exp essed in pa e n o m, as long as ac i i y in ha applica ion domain includes some o m o design, c ea i e, o p oblem-sol ing wo k (Bo che s 2000).” ESTRATÉGIAS DE DESIGN RESPONSIVO! 36! ela i as a mudanças nos elemen os em espos a à a i idade do u ilizado (Coope , Reinmann, and C onin 2007). 2.3.2 Linguagens de Pad ões e Biblio ecas de Pad ões Uma linguagem de pad ões é cons i uída po um conjun o de pad ões, en idades que se conec am pa a o ma um conjun o uni á io: Os elemen os des a linguagem são en idades denominadas pad ões (...) Cada pad ão conec a-se com os es an es, o mando uma coleção uni á ia, uma linguagem com in ini as combinações (Alexande 1977).20 O undamen o eó ico necessá io à aplicação da linguagem desc i a po Alexande é explicado na sua ob a The Timeless Way o Building, publicada em 1979. Também Tidwell desen ol e e ap esen a uma linguagem de pad ões pa a o design de in e ação. A au o a e e e: “Uma linguagem des e ipo é um conjun o de pad ões in e ligados, que pa ilham suposições, e minologias, e con ex os.”21 A p opósi o do mesmo concei o, Bo che s a i ma que es e az e e ência a pad ões de al o ní el, desc e endo o con ex o da sua aplicação e a pad ões de baixo ní el, que podem se usados depois dos p imei os, pa a e ina mais p o undamen e a solução. Es a hie a quia es u u a uma coleção ab angen e de pad ões, o mando uma linguagem de pad ões (Bo che s 2000). Segundo Coope e al., “Um e mo mais comum pa a desc e e uma coleção de pad ões num domínio é biblio eca pad ões ou ca álogo de pad ões (2014).”22Assim, linguagem de pad ões diz espei o a um conjun o de pad ões que po sua ez es ão incluídos numa biblio eca de pad ões. Dada a mul idisciplina idade que ca ac e iza es as biblio ecas, a sua aplicação em acili a a comunicação en e p o issionais das di e sas disciplinas: “Um ocabulá io comum pode melho a signi ica i amen e a comunicação den o da 20 TA: “The elemen s o his language a e en i ies called pa e ns (...) Each pa e n connec ed o o he pa e ns so ha you g asp he collec ion o all 253 pa e ns as a whole, as a language, wi hin which you can c ea e an in ini e a ie y o combina ions (Alexande 1977).” 21 TA: “A language o his so is a se o in e ela ed pa e ns, which sha e simila assump ions, e minologies and con ex s (Tidwell 1999).” 22 TA: “A mo e common e m o desc ibe a collec ion o pa e ns in a domain is pa e n lib a y o pa e n ca alogue (Coope , Reinmann, and C onin 2007).” ESTRATÉGIAS DE DESIGN RESPONSIVO! 37! equipa (Bo che s 2000).”23 2.3.2.1 Análise Compa a i a en e Biblio ecas de Pad ões Na sua disse ação Web Design Pa e ns o Mobile De ices, Jo ge Ribei o (2012) desen ol e uma análise compa a i a en e dezasseis biblio ecas de pad ões, endo como pon o ulc al a es u u a de ap esen ação dos pad ões nas di e en es biblio ecas. Pa ece-nos opo uno inclui as suas p incipais conclusões nes a in es igação, cons uindo assim um enquad amen o mais comple o do concei o em causa. As biblio ecas escolhidas pa a a cons ução da e e ida análise são: • A Pa e n Language (Alexande 1977); • Design Pa e ns: Elemen s o Reusable Objec -O ien ed So wa e (Gamma e al. 1994); • Common G ound: A Pa e n Language o Human-Compu e In e ace Design (Tidwell 1999); • A Pa e n App oach o In e ac ion Design (Bo che s 2000); • The Design o Si es: Pa e ns o C ea ing Winning Websi es ( an Duyne, Douglas K., James A. Landay 2002); • Yahoo! Design Pa e n Lib a y (Yahoo 2006); • Pa e ns o Compu e -Media ed In e ac ion (Schümme , Till 2007); • ui Pa e ns (Toxboe 2007); • In o Design Pa e ns (Beh ens 2008); • Pa e n y (Pa e n Fac o y 2009); • Designing Web In e aces (Sco , Bill 2009); • Designing Social In e aces (C umlish, Ch is ian 2009); • Banco de Pad ões de Design (Ins i u o Supe io Técnico 2010); • Designing In e aces (Tidwell 1999); • Designing Mobile In e aces (Hoobe , S e en 2011); • Mobile Design Pa e n Galle y (Neil 2012). 23 TA: “Such a common ocabula y can g ea ly imp o e communica ion wi hin he eam (Bo che s 2000).” ESTRATÉGIAS DE DESIGN RESPONSIVO! 38! Pa a além das biblio ecas an e io men e e e idas, op ámos po inclui mais duas biblio ecas na análise: • Web Design Pa e ns o Mobile De ices (Ribei o 2012); • Google Ma e ial Design Pa e ns (Google 2015). Pa a p ocede mos a uma compa ação mais sis emá ica das biblio ecas, cons uímos uma abela com as p incipais ca a e ís icas de cada uma delas, de aco do com os pa âme os seguidamen e ap esen ados ( ide Anexo 1: Tabela Compa a i a en e Biblio ecas de Pad ões). No e-se que emos como e e ência base o abalho desen ol ido po Alexande , dada a sua impo ância enquan o p ecu so do concei o em causa: A ob a de Ch is ophe Alexande No es on he Syn hesis o Fo m (1964), é um a ado indispensá el pa a o design. Nes a ob a, Alexande ap esen a uma abo dagem bas an e sólida, me odológica e sis emá ica sob e os p oblemas do design. Apesa de não se oca em ques ões ela i as ao design de sis emas digi ais, ainda assim conside a as di iculdades colocadas po con ex os ou p oblemas complexos (Ca alhais 2008).24 Alexande ado a uma abo dagem desc i i a, a a és de ex ensos pa ág a os. Apesa de de alhada, es a o ma de ap esen ação dos pad ões não oi mui o popula , apenas o concei o c iado pelo a qui e o. Também Bo che s de ende uma abo dagem mais desc i i a. Ou os au o es pa em des e concei o, e oluindo pa a e sões com secções mais pequenas e com nomes mais ilus a i os, pe mi indo uma ápida lei u a dos con eúdos dos pad ões. Alexande o ganiza os pad ões de A Pa e n Language po escala espacial (Cidades, Edi ícios e Cons ução), já que na a qui e u a es e a o é de ex ema ele ância. No caso dos pad ões de design, á ios au o es en am ambém esponde a essa p oblemá ica, man endo a ideia de hie a quia na o ganização das biblio ecas. Van Duyne e al. p opõem uma o ganização em que: “quan o mais cedo o g upo de pad ões apa ece no esquema, mais cedo de e á se usado no p ocesso de design 24 TA: “Ch is ophe Alexande ’s “No es on he Syn hesis o Fo m” (1964), is an indispensable ea y on he p ojec o design. In his book Alexande p esen ed a e y solid, me hodical and sys ema ic app oach o he p oblems o design and, al hough he wasn’ ocusing in he issues o designing o digi al sys ems, he ne e heless conside ed he di icul ies posed by e y complex con ex s, o p oblems (Ca alhais 2008).” ESTRATÉGIAS DE DESIGN RESPONSIVO! 39! (2002).”25 Tidwell u iliza um sis ema semelhan e, no qual os pad ões se o ganizam “pela sua p oximidade de o dem no p og esso do design (2010).”26 2.3.2.1.1 Nome O Nome dos pad ões é um elemen o undamen al na sua de inição. Alexande a i ma que a p ocu a po um nome é uma pa e undamen al do p ocesso de c ia e descob i um pad ão (1977).27Tidwell suge e que não de em se usados nomes cen ados na disciplina de design, pa a que possam se acilmen e comp eendidos po ou os p o issionais. Alexande ado a uma no ma em que os nomes dos pad ões são esc i os com le as maiúsculas. Au o es como Bo che s em A Pa e n App oach o In e ac ion Design seguem o seu exemplo. Ou os op am po u iliza no mas dis in as. Em Designing In e aces (Tidwell 2010) os nomes são esc i os em le as maiúsculas e com co . Algumas biblio ecas, como A Pa e n Language, u ilizam núme os pa a iden i ica cada pad ão. Em The Design o Si es ( an Duyne, Douglas K., James A. Landay 2002) e em Compu e -Media ed In e ac ion (Schümme 2007), são u ilizados al abe os p óp ios que mis u am le as e núme os, pa a o ganiza os pad ões. Es a abo dagem é mais comum em abalhos imp essos. 2.3.2.1.2 Ranking A maio ia das biblio ecas não classi icam os pad ões. Aquelas que o azem, u ilizam po no ma uma escala de ês pa ama es, baseada na que Alexande u iliza em A Pa e n Language (como as biblio ecas de Bo che s e Schümme ). A Yahoo! Design Pa e n Lib a y ado a um sis ema mui o semelhan e ao e e ido, igualmen e o ganizado em ês pa ama es (T abalho Be a, Solução e Melho P á ica). Des acam- se duas biblio ecas online que baseam a classi icação dos pad ões nas o ações 25 TA: "(…) he ea lie he pa e n g oup appea s on his scheme, he ea lie i should be used in he design p ocess ( an Duyne, Douglas K., James A. Landay 2002).” 26 TA: “(…) by hei app oxima e o de in he design p og ession (Tidwell 2010).” 27 TA: “ he sea ch o a name is a undamen al pa o he p ocess o in en ing o disco e ing a pa e n (Alexande 1977).” ESTRATÉGIAS DE DESIGN RESPONSIVO! 40! a ibuídas pelos u ilizado es (ui-Pa e ns (Toxboe 2007) e In o Design Pa e ns (Beh ens 2008)). Fig. 7 Exemplo de es u u a de pad ão de ui-Pa e ns, 2007. 2.3.2.1.3 Con ex o Em A Pa e n Language (Alexande 1977), cada pad ão é an ecedido po um pequeno pa ág a o que o con ex ualiza. Esse ex o in oduz o pad ão, elacionando-o com ou os da biblio eca. Nou as biblio ecas, os pad ões podem se an ecedidos po um pequeno ex o desc i i o, mas não com o in ui o de os elaciona com ou os pad ões. 2.3.2.1.4 Ilus ação Excep o Common G ound (Tidwell 1999), que ca ece de indicações isuais, odas as biblio ecas ilus am os pad ões que as compõem. O ipo de ilus ação a ia consoan e a á ea de es udo em causa. Alexande se e-se de o og a ias de edi ícios e espaços. No caso das biblio ecas de pad ões de design, a noção de empo é undamen al pa a sua in e p e ação, já que mos am os á ios es ádios de in e ação dos u ilizado es com os pad ões. Bo che s usa o og a ias de u ilizado es a in e agi com o sis ema. Em Pa e ns o Compu e -Media ed In e ac ions (Schümme ESTRATÉGIAS DE DESIGN RESPONSIVO! 41! 2007), os pad ões são acompanhados de o og a ias que simbolizam os seus nomes. In o DesignPa e ns, (Beh ens 2008) op a po uma abo dagem o iginal. Na sua biblio eca, as habi uais imagens es á icas são subs i uídas po in e ações eais, o e ecendo ao u ilizado a opo unidade de es a os pad ões. Des acamos a Web Pa e ns o Mobile De ices (Ribei o 2012) que pa a além dos elemen os es u u ais do pad ão, inclui os ambém elemen os in e a i os que o o mam. Fig. 8 Exemplo de o og a ia e diag ama ilus a i os de A Pa e n App oach o In e ac ion Design, 2000. Fig. 9 Exemplo de ilus ação de In o Design Pa e ns, 2008. ESTRATÉGIAS DE DESIGN RESPONSIVO! 48! 2.4 Design Cen ado no U ilizado O concei o de In e ace Humano-Máquina su giu na década de 70, e e indo- se aos aspe os do sis ema com os quais o u ilizado en a em con ac o (Mo an 1981).36 Na sequência do seu apa ecimen o, o concei o In e ação Humano- Compu ado (daqui em dian e, IHC) oi ado ado em meados dos anos 1980. Os au o es Baecke e Bux on de inem IHC como um conjun o de p ocessos, diálogos e ações, a a és dos quais um u ilizado humano in e age com o compu ado (Baecke & Bux on 1987).37 Pos e io men e, ou os au o es abo da am o mesmo concei o: In e ação Humano-Compu ado é uma disciplina que a a ques ões de concepção, a aliação e implemen ação de sis emas de compu ação in e a i os pa a uso do Homem, assim como os p incipais enómenos que os ce cam (ACM SIGCHI 1992).38 IHC a a do desenho de sis emas que pe mi am ao u ilizado execu a as suas a i idades de uma o ma p odu i a e segu a. Es a disciplina em um papel undamen al no desenho e desen ol imen o de odos os ipos de sis emas, desde sis emas de con olo do á ego aé eo ou de p ocessamen o nuclea , nos quais a segu ança é ex emamen e impo an e, a é sis emas que p i ilegiam a p odu i idade e a sa is ação p o issional dos u ilizado es. O p incipal obje i o da IHC é desen ol e ou melho a a segu ança, u ilidade, e icácia e usabilidade de sis emas que incluem compu ado es (1989).39 A Usabilidade é um concei o cha e no con ex o da IHC e aduz-se na c iação de sis emas áceis de usa . Segundo K ug, se algo é usá el, que se a e de um websi e, um comando ou uma po a gi a ó ia – al signi ica que uma pessoa de habilidade e expe iência média (ou mesmo abaixo da media) é capaz de descob i como a u iliza sem g ande di iculdade (2014).40 36 TA: “(…) hose aspec s o he sys em ha he use comes in con ac wi h (Mo an 1981).” 37 TA: “se o p ocesses, dialogues and ac ions h ough which a human use employs and in e ac s wi h a compu e (Baecke & Bux on 1987).” 38 TA:” (...) human-compu e in e ac ion is a discipline conce ned wi h he design, e alua ion and implemen a ion o in e ac i e compu ing sys ems o human use and wi h he s udy o majo phenomena su ounding hem (ACM SIGCHI 1992).” 39 TA: “ o de elop o imp o e he sa e y, u ili y, e ec i eness, and usabili y o sys ems ha include compu e s (“In e ac ing wi h Compu e s” 1987).” 40 TA: “I some hing is usable — whe he i ’s a Web si e, a emo e con ol, o a e ol ing doo — i means ha A pe son o a e age (o e en below a e age) abili y and expe ience can igu e ou how o use he ESTRATÉGIAS DE DESIGN RESPONSIVO! 49! Comp eende o âmbi o da IHC é coloca os u ilizado es em p imei o luga . É em unção das sua necessidades, capacidades e p e e ências que os sis emas são desenhados, não o con á io. Donald No man iden i ica dois p incípios cha e que ajudam a assegu a uma boa IHC: isibilidade (os comandos de em es a bem isí eis) e a o dance (o seu design de e suge i a sua uncionalidade). Segundo No man, a o dance diz espei o às p op iedades dos obje os – que ipos de ope ações e manipulações podem se ei as pa a um de e minado obje o (2013).41 Es e p incípio em um papel undamen al no design de obje os mas o que mais impo a é a chamada pe cei ed a o dance, is o é, aquilo que o u ilizado iden i ica como a unção do obje o em causa. Pa indo dos p incípios da ICH, a me odologia de Design Cen ado no U ilizado coloca o u ilizado no cen o do p ocesso de c iação. 2.5 Design pa a a Saúde O cuidado e o cuidado na saúde dizem espei o ao cuidado da Humanidade. A saúde é, simul aneamen e, pessoal e uni e sal – al ez o único alo que impo a a oda a gen e (Jones 2013).42 A saúde é um sis ema de g ande complexidade que depende de duas componen es opos as: a ins i ucional (hospi ais e ou as ins i uições de saúde) e a pessoal (os p o issionais, os u en es e os seus amilia es). A na u eza da elação en e es as duas componen es é em udo imp e isí el. O c escen e p o agonismo da ecnologia in o má ica nas di e sas á eas, nomeadamen e na da saúde, associado à complexidade que ca ac e iza es e se o , a ibui uma esponsabilidade ex ema ao p ocesso de design. A p á ica de design de sis emas e se iços de e se p o undamen e in o mada, já que um mau design ai e epe cussões nega i as no quo idiano de p o issionais e u en es da á ea da saúde. No seu li o, Design o Ca e, Pe e H. Jones a i ma que a complexidade de aplicações hing o accomplish some hing wi hou i being mo e ouble han i ’s wo h (K ug 2014).” 41 TA: ”A o dance e e s o he p ope ies o objec s - wha so s o ope a ions and manipula ions can be done o a pa icula objec (D. No man 2013).” 42 TA: “Ca e, and heal hca e, is abou aking ca e o humani y. Heal h is pe sonal and uni e sal — i may be he one alue e e yone ca es abou (Jones 2013). ESTRATÉGIAS DE DESIGN RESPONSIVO! 50! ecnológicas pa a saúde exige que os designe s açam um comp omisso pessoal, en ol endo anos de ap endizagem, p á ica e paciência. Espe a-se que os designe s comp eendam e se adap em à linguagem do domínio da saúde, em de imen o da linguagem do design e expe iência do u ilizado (2013). Resol e es a ques ão passa po de ini es a égias pa a a cons ução de uma linguagem uni á ia: “Se não abalha mos jun os na cons ução de uma es a égia sis emá ica, podemos es a a con ibui pa a a agmen ação do amo.” (Jones 2013)43 Jones a i ma se necessá io delinea es a égias ao ní el do design pa a a ingi a ino ação, já que “uma es a égia de design de e mina se os ges o es ão co e o isco de al e a o signi icado dos se iços de saúde, ou simplesmen e adap a a ecnologia às p á icas a uais (2013).”44 A di iculdade do p ocesso de design nes a á ea, eside sob e udo na disc epância en e o p odu o e o e i ó io ao qual es e se des ina. Se po um lado o design lida com concei os abs a os, a saúde abalha com sujei os conc e os, na esolução con ínua de p oblemas p á icos (Jones 2013). Apesa da c escen e impo ância da ecnologia, é necessá io equaciona qual o papel que es a ocupa no amo da saúde, já que nem odos os sis emas nos cuidados de saúde são baseados no compu ado . Aqui, as elações humanas con inuam a se ulc ais. O a endimen o é ealizado po pessoas (desde o diagnós ico e a amen o dos pacien es, p ocedimen os e cuidados pos e io es, assim como o planeamen o da assis ência) e ais p ocessos não são au oma izados (Jones 2013). A abo dagem a ual que p edomina na p á ica do design pa a a saúde coloca o pacien e como cen o do p oje o. Bi gi Mage , p o esso de design e undado do Se ice Design Ne wo k, a i ma que pensa no design de se iços “o objec i o é ga an i que as in e aces sejam ú eis, u ilizá eis e desejá eis do pon o de is a do clien e, e e icien es e dis in as do pon o de is a do o necedo (Mage , 2007).”45 Simul aneamen e, odos os elemen os con e gem pa a o e ece ao pacien e um p odu o inal na o ma de se iço clínico. Se iços como os qua os dos hospi ais, comunicações, assis ência, a amen o e pagamen o, podem se melho ados a a és de p á icas de design. A implemen ação de me odologias aplicadas ao design pa a a saúde pode se a solução pa a ans o ma expe iências agmen adas numa única 43 TA: “I we a e no wo king oge he wi h a sys emic s a egy, we may be con ibu ing o he agmen a ion o he ield (…) (Jones 2013). 44 TA: “A design s a egy de e mines whe he manage s will isk changing he meaning o heal hca e se ices o me ely adap echnology o cu en p ac ices (Jones 2013).” 45 TA: “(…) add esses he unc ionali y and o m o se ices om he pe spec i e o clien s. I aims o ensu e ha se ice in e aces a e use ul, usable, and desi able om he clien ’s poin o iew, and e ec i e, e icien , and dis inc i e om he supplie ’s poin o iew (Mage , 2007).” ESTRATÉGIAS DE DESIGN RESPONSIVO! 51! expe iência do u ilizado . John Rhein ank e Shelley E enson suge em que os se iços são hoje expe iências e que o design enquan o p á ica de e ia e olui acompanhando a essa endência, p opo cionando aos u en es expe iências emocionais posi i as. O obje i o do design pa a se iços es á a al e a -se: “(...) mudando do design cen ado no u ilizado pa a uma cons ução de expe iências signi ica i as cen adas nas suas capacidades (E enson & Dubbe ly, 2010).”46 Os hospi ais pediá icos são exemplo da e e ida al e ação. A a és de deco ações colo idas nas pa edes e da c iação de á eas ec ea i as, conseguem p opo ciona um ambien e mais descon aído aos seus pacien es. 2.6 Design e Ino ação As eo ias da ino ação celeb am o alo da ino ação dis up i a como a mais compe i i a o ma de ino ação. Au o es ligados ao mundo emp esa ial, alegam que es e ipo de in e enções causam mais impac o e ge am, po encialmen e, mais luc o, já que quem as p a ica o na-se encedo em economias de g ande escala. A u u a de p á icas comuns o nou-se o obje i o da ino ação, se não a sua p óp ia de inição. A ino ação dis up i a p ome e uma mudança ápida, a pa de in e enções ecnológicas (Jones 2013).”47 Exis e uma an agonia nos desa ios que o design en en a a ualmen e enquan o disciplina. Po um lado, há a necessidade de p oje a em unção dos u ilizado es. O design cen ado no se humano é uma abo dagem que coloca as necessidades, capacidades e compo amen os humanos em p imei o luga , depois p oje a em unção dessas necessidades (D. No man 2013). Ao mesmo empo, é p imo dial que a disciplina acompanhe e es imule o desen ol imen o ecnológico. No a igo, Lea ning and S udying In e ac ion Design, Miguel Ca alhais e e e que no con ex o da educação em design, as compe ências 46 TA: “(…) mo ing om ‘use -cen e ed’ design o hings o ‘abili y-cen e ed’ co-cons uc ion o meaning ul expe iences (E enson & Dubbe ly, 2010).” 47 TA: “Inno a ion heo ies celeb a e he alue o “dis up i e” inno a ion as he mos compe i i e o m o inno a ion. Business au ho s claim dis up i e in e en ions ha e he mos impac and p o i po en ial, because dis up i e en an s displace winne s in la ge economies. Dis up ion o cu en p ac ices has become an aim o inno a ion, i no i s e y de ini ion. Dis up i e o adical inno a ion p omises apid change wi h echnological in e en ions (…)(Jones 2013).” ESTRATÉGIAS DE DESIGN RESPONSIVO! 52! pa a o design de in e ação de em se cons uídas sob uma li e acia p ocedimen al mais ampla que em sido de endida como indispensá el pa a qualque p a ican e de no os média. O au o de ende a necessidade da al abe ização nos meios a a és dos quais as a e as in e disciplina es podem se desen ol idas e ealizadas (2008). Mas al não passa pela obse ação dos compo amen os dos u ilizado es: Concluímos que o design cen ado no se humano, com ên ase na obse ação, na ideação e nos es es é ideal pa a a ino ação inc emen al, sendo imp o á el que conduza à ino ação adical. A ino ação adical ad ém de al e ações na ecnologia ou no signi icado. A ino ação conduzida pela ecnologia é equen emen e o iginada po in en o es e au odida as. Ino ação do signi icado, pelo con á io, pode se po enciada pela pesquisa na á ea do design, mas apenas se essa pesquisa abo da ques ões undamen ais de no os signi icados e suas in e p e ações (No man & Ve gan i 2014). 48 No man e Ve gan i a i mam que a in es igação na á ea do design cen ado no se humano a amen e, ou nunca, conduz à ino ação ecnológica d amá ica. Tal acon ece po que a ino ação dos sis emas ecnológicos não esul a da me a obse ação da p á ica. Assim, o es udo do compo amen o do u ilizado ende a e o ça p á icas exis en es, já que segue pa âme os como obje i os e de p odu i idade. Segundo os au o es, de e ia an es basea -se na expe imen ação pa a alcança p á icas ino ado as . A cha e pa a a ino ação cul u al passa, segundo No man e Ve gan i, pela ino ação adical do signi icado. P á icas socio- écnicas podem se e o muladas sem muda adicalmen e as ecnologias, mas sim a inalidade social. A pe spe i a de edesenha as p á icas exis en es opõe- se à de au o es como Pe e H. Jones (2013) que de endem a ino ação adical como obje i o. É necessá io e em causa que a adoção de no os sis emas e ecnologias exige uma ex ensa análise e a aliação. Es e ipo de mudanças são ex emamen e mo osas, êm um cus o ele ado e não são necessa iamen e signi ica i as na expe iência dos u ilizado es (No man & Ve gan i 48 TA: “We conclude ha human-cen e ed design, wi h i s emphasis on i e a ed obse a ion, idea ion, and es ing is ideally sui ed o inc emen al inno a ion and unlikely o lead o adical inno a ion. Radical inno a ion comes om changes in ei he echnology o meaning. Technology-d i en inno a ion o en comes om in en o s and inke e s. Meaning-d i en inno a ion, howe e , has he po en ial o be d i en h ough design esea ch, bu only i he esea ch add esses undamen al ques ions o new meanings and hei in e p e a ion (No man & Ve gan i 2014).” ESTRATÉGIAS DE DESIGN RESPONSIVO! 53! 2014). A elação en e design e ecnologia nunca es e e ão p óxima. Nunca as endências de design, nomeadamen e no design de in e aces, o am ão impulsionadas pelas ecnologias eme gen es. No a igo Designing wi h Con as , Ma k Mi chell a i ma que hoje assis imos a uma endência de ul a-minimalismo, onde a es é ica em p io idade sob e legibilidade, acessibilidade e a descobe a. O au o e e e ainda que al endência não mos a sinais de es a a pe de popula idade, o que es á p ejudica a nossa expe iência com con eúdos digi ais. Pa alelamen e, e e e que as no as ecnologias ambém compõem es a endência (2015). O au o coloca es a ques ão, ale ando pa a o ac o da disciplina es a a caminha pa a a adoção de uma abo dagem eli is a: “Co emos o isco de p oje a salas VIP, onde o cus o de en ada é um Mac com um ec ã Re ina.”49 Ao mesmo empo, Mi chell a i ma que assis imos a uma epe ição, mui as ezes azia e sem signi icado, a i mando que as escolhas ipog á icas e co es ão em oga com os a uais p odu os e se iços digi ais popula es êm pouco em comum com as ma cas que p e endem ep esen a . Os p oblemas su gem quando nos ocamos no es ilo, sem con ex o; o ma sem unção; mime ismo como mé odo (2015). 49 TA: “We a e unning he isk o designing VIP lounges whe e he cos o en y is a Mac wi h a Re ina display (Mi chell 2015).” ESTRATÉGIAS DE DESIGN RESPONSIVO! 54! 3 EPR MULTIPLATAFORMA 3.1 Ap esen ação dos casos de es udo O EPR Mul ipla a o ma é uma aplicação Web cons i uída po duas e en es dis in as: EPR Médico, concebida pa a se usada po médicos e EPR En e magem, di ecionada ao uso dos en e mei os. O EPR Médico Mul ipla a o ma é um sis ema de in o mação clínica o ien ado à mobilidade nas á eas de In e namen o, Consul a Ex e na, Bloco Ope a ó io e U gência. A aplicação em como base a in o mação exis en e no EPR Médico e no EPR de En e magem (as duas e en es es ão in e ligadas). A sua p incipal unção é disponibiliza aos p o issionais de saúde a in o mação clínica necessá ia ao acompanhamen o adequado do doen e. O EPR Médico oi o imizado pa a unciona , simul aneamen e, em Desk op e em Table . O EPR En e magem Mul ipla a o ma é uma aplicação que oi desen ol ida pa a se u ilizada em disposi i os mó eis, no egis o dos en e mei os jun o à cama do doen e. O seu p incipal obje i o é ga an i os egis os de en e magem de o ma segu a, ápida e e icaz em empo eal, jun o do doen e. Na Tabela da Solução Clínica EPR Mul ipla a o ma ( ide Anexo 2), p e endemos sin e iza as duas soluções, no que espei a às suas p incipais ca a e ís icas. Ambas ep esen am um e olução aplicacional pa a HTML. O pe il do Médico, encon a a-se maio i a iamen e na ecnologia D.ne . O pe il de En e magem, e oluiu a pa i da ecnologia O acle Fo ms. As duas soluções es ão implemen adas em di e en es ins i uições. O EPR Médico, encon a-se nas seguin es: Hospi al de Vila F anca de Xi a, Hospi al de San a Ma ia e Hospi al de B aga. B e emen e, se á implemen ado ambém no IPO do Po o e no Hospi al da P elada (Po o). No caso do EPR En e magem, encon a- se implemen ado no Hospi al da Cu (Po o) e se á b e emen e implemen ado no IPO do Po o. Rela i amen e aos con ex os das soluções, o EPR Médico em dois con ex os dis in os: o do médico (“ isão descon ex ualizada”) e o do doen e (“ isão con ex ualizada”); o EPR En e magem segue uma lógica con ex ual semelhan e, que inclui dois con ex os dis in os: o con ex o do en e mei o ( isão descon ex ualizada) e o con ex o do doen e ( isão con ex ualizada). ESTRATÉGIAS DE DESIGN RESPONSIVO! 55! Fig. 12 Esquema-sín ese da aplicação EPR Mul ipla a o ma (p oduzida pela au o a). No que espei a às á eas uncionais, o EPR Médico em qua o á eas dis in as, p esen es na isão descon ex ualizada do médico: Bloco Ope a ó io, Consul a, In e namen o e U gência. O EPR En e magem con ém a á ea do In e namen o, associada à isão descon ex ualizada do en e mei o. Tal como as á eas uncionais, ambém as uncionalidades de ambas as soluções se di idem po con ex o. No caso do EPR Médico, à isão descon ex ualizada es ão associadas as seguin es uncionalidades: • No i icações; • Rela ó ios; • Ta e as. Já à isão con ex ualizada, encon am-se associadas as seguin es: • His ó ico Clínico; ESTRATÉGIAS DE DESIGN RESPONSIVO! 56! • No as Clínicas; • Diagnós icos e P oblemas; • eResul s; • Rela ó ios; • Moni o izações; • P opos a Ci ú gica; • Pedido de In e namen o; • P esc ição In e na; • P esc ição Ex e na; • Regis o e Requisição MCDT50; • Pedido de Consul a; • Al a Clínica; • Ale gias; • Dados Demog á icos; • PIM51; • Ta e as. O EPR En e magem con ém, na isão descon ex ualizada, as seguin es uncionalidades: • Lis a de Doen es; • Moni o izações; • Vigilâncias; • Ca dex.52 Na isão con ex ualizada, encon am-se: • His ó ico do Doen e; • Regis o de Consumos; • Ve i icação P é-ci ú gica; • Ve i icação Pós-ci ú gica; 50 Meios Complemen a es de Diagnós ico e apêu ico. 51 P esc ição Médica In e na. 52 De inição de Ka dex: (...) pe mi e uma e e ência ápida às necessidades especí icas de cada pacien e pa a ce os aspec os do cuidado do en e mei o. Pode inclui um ho á io da oma de medicamen os, ní el de a i idade pe mi ida, capacidade do pacien e de ealiza cuidados básicos a si mesmo, die a, p oblemas especiais, p og amação de a amen os e p ocedimen os e plano de cuidados. TA: “(...) allows quick e e ence o he pa icula needs o each pa ien o ce ain aspec s o nu sing ca e (...) may be a schedule o medica ions, le el o ac i i y allowed, abili y o pe o m basic sel -ca e, die , any special p oblems, a schedule o ea men s and p ocedu es, and a ca e plan (Mosby’s Medical Dic iona y 2009).” ESTRATÉGIAS DE DESIGN RESPONSIVO! 57! • A aliação Inicial; • Plano do Doen e. Os obje i os uncionais encon am-se associados às uncionalidades desc i as. No que espei a à pla a o mas e aos disposi i os, ambas as soluções es ão desen ol idas em HTML e o imizadas pa a se em u ilizadas em Desk op e Table . 3.2 EPR Médico Mul ipla a o ma 3.2.1 Funcionalidades: Menus Descon ex ualizado e Con ex ualizado Depois do u ilizado e e ua a au en icação na aplicação ( e ig. 13), em acesso ao Menu Descon ex ualizado (no e-se que, quando nos e e imos a “Descon ex ualizado”, e e imo-nos ao con ex o do médico, que se encon a descon ex ualizado po elação ao doen e). O p imei o ec ã ( e ig. 14), disponibiliza uma sé ie de á eas uncionais: Bloco Ope a ó io, Consul a, In e namen o e U gência. Simul aneamen e, o e e ido menu dá acesso às seguin es uncionalidades: No i icações, Rela ó ios e Ta e as. Fig. 13 Ec ã de au en icação na aplicação EPR Mul ipla a o ma em Desk op (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 64! de e minada ca ego ia” (...) ge almen e ap esen a ou as opções no mesmo ní el de hie a quia, bem como opções da hie a quia seguin e (Kalbach 2008).”56 Ge almen e a na egação global su ge de uma o ma consis en e, semp e na mesma posição do ec ã, pa a que o u ilizado se consiga si ua no con ex o da es u u a. Tal não acon ece na aplicação EPR Mul ipla a o ma. A na egação global, cons i uída pelas uncionalidades p incipais da aplicação, é subi amen e subs i uída pela na egação local, quando su gem as uncionalidades do doen e ( e ig. 19). Des a o ma, o u ilizado pe de o con ex o de u ilização, deso ien ando a sua expe iência de na egação do sis ema. Apesa do cabeçalho ap esen a a in o mação da uncionalidade p incipal an e io men e selecionada, al acon ece de uma o ma disc e a que nos pa ece se insu icien e pa a o ien a a expe iência de na egação. Fig. 19 As uncionalidades p incipais p esen es no ec ã an e io , são subs i uídas pelas uncionalidades con ex ualizadas do doen e (p oduzida pela au o a). T adicionalmen e, a na egação de odapé con ém in o mações suplemen a es não pe inen es ao ema p incipal do si e (…) mas es e ipo de na egação não é necessa iamen e insigni ican e (Kalbach 2008).” 57 No caso do EPR 56 TA:” Local na iga ion is used o access lowe le els in a s uc u e, below he main na iga ion pages. The e m "local" implies "wi hin a gi en ca ego y." On a gi en page, local na iga ion gene ally shows o he op ions a he same le el o a hie a chy, as well as he op ions below he cu en page (Kalbach 2008).” 57 TA: “T adi ionally, oo e na iga ion con ains supplemen a y in o ma ion no pe inen o main opic o he si e (…) Bu oo e na iga ion doesn' ha e o be insigni ican (Kalbach 2008).” ESTRATÉGIAS DE DESIGN RESPONSIVO! 65! Mul ipla a o ma, a na egação de odapé ap esen a in o mações especí icas ela i as ao doen e selecionado e pe mi e e e ua uma pesquisa sob e odos os doen es. Fig. 20 Hie a quia da na egação na e en e Médico da aplicação EPR Mul ipla a o ma, em Table (p oduzida pela au o a). Fig. 21 Ec ã descon ex ualizado na e en e en e magem, em Table e ical e ho izon al (p oduzida pela au o a). A mesma es u u a de na egação epe e-se nas duas e en es da aplicação EPR. Simul aneamen e, a o ganização dos componen es de na egação pouco a ia nos di e en es disposi i os, ou de aco do com a sua o ien ação ( e ig. 21). Ao pe co e a hie a quia do sis ema, o u ilizado pe de con ex o de u ilização, ques ão que po esol e em odos os disposi i os pa a os quais a aplicação es á ESTRATÉGIAS DE DESIGN RESPONSIVO! 66! desen ol ida. É u gen e epensa es as duas ques ões: a al a de con ex o de na egação na expe iência do u ilizado e a al a de esponsi idade do sis ema. ESTRATÉGIAS DE DESIGN RESPONSIVO! 67! 3.5 Pad ões de Na egação no EPR Mul ipla a o ma 3.5.1 Con ex o de Na egação Fig. 22 Con ex o da Na egação na e en e médico do EPR Mul ipla a o ma (p oduzida pela au o a). A in o mação e e en e à uncionalidade selecionada no p imei o g au da hie a quia dá ao u ilizado o seu con ex o de localização no sis ema. P oblema O u ilizado p ecisa de sabe qual a sua localização na es u u a hie á quica do sis ema, pa a consegui ol a a ás pa a um ní el mais ele ado da hie a quia Solução É ap esen ada a con ex ualização ela i amen e à uncionalidade da na egação global an e io men e selecionada pelo u ilizado . ESTRATÉGIAS DE DESIGN RESPONSIVO! 68! Exemplo Fig. 23 Con ex o da Na egação no websi e do The Gua dian UK ( e i ada de Designing o Touch, 2015). 3.5.2 Menu Pe sis en e Fig. 24 Menu Pe sis en e na e en e médico do EPR Mul ipla a o ma (p oduzida pela au o a). Es e ipo de menu es á semp e p esen e, ge almen e no lado esque do da página, ap esen ando odas as opções. ESTRATÉGIAS DE DESIGN RESPONSIVO! 69! P oblema O u ilizado p ecisa de na ega en e as secções p incipais da aplicação. Solução O menu con ém uma lis a e ical com as p incipais uncionalidades, o ien ando o u ilizado na na egação global. Exemplo Fig. 25 Menu Pe sis en e no websi e do designe Rich B own ( e i ada de h p://www. ichb own.in o) 3.5.3 Menu Deslizan e Fig. 26 Menu Deslizan e na e en e En e magem da aplicação EPR Mul ipla a o ma (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 70! Es e ipo de menu desliza pa a den o e pa a o a do ec ã, semp e que necessá io. P oblema Nos disposi i os de meno dimensão (como é o caso do Table Ve ical) o menu pe sis en e ocupa espaço necessá io pa a a isualização dos con eúdos. Solução O menu desliza pa a o a do ec ã semp e que necessá io, disponibilizando espaço pa a a ap esen ação dos con eúdos p incipais da aplicação. Exemplo Fig. 27 Exemplo de menu deslizan e no acesso ao Mail no iPad a a és de um ges o swipe ( e i ada de Designing o Touch, 2015). ESTRATÉGIAS DE DESIGN RESPONSIVO! 71! 3.5.4 Ba a de Na egação Ho izon al ( opo) Fig. 28 Ba a de na egação ho izon al de opo na aplicação EPR mul ipla a o ma, e en es médico desk op e en e magem em able e ical (p oduzida pela au o a). Es e pad ão de na egação é ipicamen e u ilizado quando exis e uma u ilização equen e das di e en es is as. No caso do EPR Mul ipla a o ma, dá acesso às á ias is as sob e o mesmo con eúdo, nomeadamen e, Lis a De alhada, Lis a No mal, In o mação sob e as legendas e il os, na e en e médico e di e en es isões da lis a de doen es, na e en e en e magem. P oblema Os u ilizado es p ecisam de na ega apidamen e en e di e en es is as de igual impo ância. Solução Pe mi e aos u ilizado es na ega em acilmen e di e en es ca ego ias do mesmo ní el hie á quico. ESTRATÉGIAS DE DESIGN RESPONSIVO! 72! Exemplo Fig. 29 Exemplo de ba a de na egação ho izon al ( opo) na aplicação Li es eam ( e i ada de h ps://li es eam.com) 3.5.5 Ba a de Na egação Ho izon al ( odapé) Fig. 30 Ba a de na egação ho izon al de odapé na aplicação EPR Mul ipla a o ma, e en e médico em able ho izon al (p oduzida pela au o a). Es e pad ão de na egação é ipicamen e u ilizado quando exis e uma u ilização equen e das di e en es is as. No caso da aplicação EPR Mul ipla a o ma, ap esen a in o mações ela i as ao doen e selecionado. É mui o u ilizado em disposi i os mó eis, especialmen e em iOS, onde a localização no odapé do ec ã acili a a e gonomia. Tal a ia consoan e o sis ema ope a i o. No caso do And oid o ESTRATÉGIAS DE DESIGN RESPONSIVO! 73! sis ema con ém de aiz bo ões de na egação na ba a de odapé, pelo que é mais con enien e posiciona a na egação no opo do ec ã. Des a o ma é possí el e i a o conges ionamen o de bo ões de na egação. P oblema Os u ilizado es p ecisam de na ega apidamen e en e di e en es is as de igual impo ância. Solução Pe mi e aos u ilizado es na ega em acilmen e di e en es ca ego ias do mesmo ní el hie á quico. Exemplo Fig. 31 Exemplo de ba a de na egação ho izon al ( odapé e opo) na aplicação Facebook, espe i amen e pa a iOS e And oid ( e i ada de Designing o Touch, 2015). ESTRATÉGIAS DE DESIGN RESPONSIVO! 80! Fig. 38 Quan idade de egis os de u ilização po uncionalidade, no EPR Médico (p oduzida pela au o a). 4.2.2 En e is as Uma das componen es de ca á e quali a i o que sus en ou o nosso abalho oi a ealização de en e is as aos u ilizado es inais da aplicação, pa a comp eende as suas necessidades no uso do sis ema em causa. Simul aneamen e, com o obje i o de comp eende a e olução do p ocesso de implemen ação da aplicação, en e is ámos os p o issionais da Glin . 4.2.2.1 En e is as aos U ilizado es Finais As en e is as ealizadas aos p o issionais de saúde do IPO do Po o e do Hospi al de Vila F anca de Xi a, o am undamen ais pa a a ca a e ização dos u ilizado es inais, no que espei a à o ma como u ilizam o EPR Mul ipla a o ma. Fo am en e is ados dois en e mei os e dois médicos do IPO do Po o e qua o médicos do Hospi al de Vila F anca de Xi a. Tal possibili ou-nos iden i ica qua o pe sonas dis in as, com di e en es obje i os na u ilização do EPR Mul ipla a o ma. Sendo o nosso p incipal oco a esponsi idade ao ní el da na egação, as duas pe sonas p imá ias êm obje i os de u ilização bas an e ele an es no con ex o da mobilidade do EPR Mul ipla a o ma. No pe il do En e mei o, des acam-se como obje i os p incipais dos u ilizado es, as uncionalidades associadas a: • P epa ação dos doen es pa a exame; • Recob o dos doen es após exame. No pe il do Médico, des acam-se os seguin es obje i os inais, no uso da aplicação: • Funcionalidades da u gência; • Funcionalidades do in e namen o; • Visualização de exames. ESTRATÉGIAS DE DESIGN RESPONSIVO! 81! 4.2.2.2 En e is as aos p o issionais da Glin As en e is as aos p o issionais da Glin o am ealizadas no pe íodo comp eendido en e os dias 8 e 15 de Ma ço de 2016, nas ins alações da Glin . Fo am en e is ados oi o p o issionais (Vide Anexo 5: En e is as aos P o issionais da Glin ), odos in e enien es no p ocesso de c iação da aplicação EPR Mul ipla a o ma, com unções dis in as: • Paulo Co eia, Senio Manage ; • Mau ícia Cas o, Senio Manage ; • Miguel Cas o, P oduc Manage ; • F ancisco Vicen e, So wa e De elope ; • Rui Gou eia, Senio Consul an ; • Hélde Pai a, Senio Consul an ; • Sónia Gomes, Beginne Consul an ; • José Cas o, Designe . A a és da ealização das en e is as aos p o issionais da Glin , conseguimos a e i que: • As duas e en es da aplicação EPR Mul ipla a o ma cons i uem e oluções aplicacionais ( e igs. 39 e 40) no que espei a às linguagens em que es ão desen ol idas: no caso da e en e médico, é uma e olução da ecnologia D.ne pa a HTML; a e en e de en e magem cons i ui uma e olução da linguagem de O acle Fo ms, ambém pa a HTML. O ac o da aplicação es a a se adap ada pa a uma no a linguagem con ibui pa a a des agmen ação da sua es u u a e da sua iden idade g á ica; • A e en e Médico da aplicação EPR Mul ipla a o ma oi pensada p imei o pa a desk op e só pos e io men e começou a se adap ada pa a able (ho izon al), daí a sua agilidade no que espei a à esponsi idade; • A e en e de En e magem é mais ecen e, po isso mui os dos ec ãs es ão ainda em desen ol imen o. Nes a e en e já o am p e is os de aiz ec ãs pa a desk op e able (ho izon al e e ical); • A aplicação EPR En e magem oi inicialmen e pensada pa a unciona como um p og ama s and-alone, só depois se decidiu in eg a oda a solução, uni o mizando-a pa a c ia o EPR Mul ipla a o ma. ESTRATÉGIAS DE DESIGN RESPONSIVO! 82! Fig. 39 Exemplo de ec ã do EPR En e magem na ecnologia O acle Fo ms. Fig. 40 Exemplo de ec ã do EPR Médico na ecnologia D.Ne . ESTRATÉGIAS DE DESIGN RESPONSIVO! 83! 4.3 Ca a e ização das Pe sonas Modelos de u ilizado es ou pe sonas, são a qué ipos de alhados dos u ilizado es, que ep esen am g upos dis in os de compo amen os, a i udes, obje i os e mo i ações, obse ados e iden i icados ao longo da ase de pesquisa (Coope , Reinmann, and C onin 2007).59 As en e is as ealizadas aos u ilizado es da aplicação EPR Mul ipla a o ma e a ou os p o issionais de saúde que, apesa não ainda se em u ilizado es, ão começa a u iliza a aplicação b e emen e, oi undamen al pa a a ca a e ização das pe sonas. As en e is as o am ealizadas no Hospi al de Vila F anca de Xi a e no IPO do Po o, endo sido en e is ados se e p o issionais de saúde, en e médicos e en e mei os. Os dados e i ados das e e idas en e is as são de ca á e quali a i o, que pela na u eza da écnica de ecolha de dados em causa, que pelo ac o da amos a de en e is ados se eduzida e não ep esen a i a. Fo am iden i icados ês ipos de pe sonas: duas p imá ias, uma secundá ia e uma complemen a . Sendo o obje i o da p esen e in es igação es uda da esponsi idade da aplicação EPR Mul ipla a o ma, o p incipal c i é io pa a a dis inção dos ipos de pe sonas, oi a u ilização, ou não u ilização de di e en es disposi i os (desk op e able ). Cons i uem pe sonas p imá ias, aquelas que u ilizam mais do que um ipo de disposi i o e, simul aneamen e, êm obje i os mais ab angen es no uso da aplicação. Secundá ias, as que usam apenas o Desk op nas a e as que execu am, com obje i os mais es i os. A pe sona complemen a u iliza a aplicação apenas numa pe spe i a de moni o ização dos p o issionais que di ige, não sendo uma u ilizado a egula da mesma. As imagens que se seguem ( e igs. 41, 42, 43 e 44) ilus am as pe sonas iden i icadas, no âmbi o do p esen e p oje o. Os aspe os comuns às qua o pe sonas iden i icadas são os seguin es: • São p o issionais de saúde, médicos ou en e mei os; • Sen em-se à on ade no uso de ecnologias; • Valo izam a mobilidade e a digi alização de p ocessos; • Não êm p oblemas cogni i os. 59 TA: “Use models, o pe sonas, a e de ailed, composi e use a che ypes ha ep esen dis inc g oupings o beha io s, a i udes, ap i udes, goals, and mo i a ions obse ed and iden i ied du ing he Resea ch phase (Coope , Reinmann, and C onin 2007).” ESTRATÉGIAS DE DESIGN RESPONSIVO! 84! 4.3.1 Pe sona P imá ia 1 A p imei a pe sona p imá ia que iden i icámos ( e ig. 41) na sequência das en e is as ealizadas aos p o issionais de saúde das ins i uições an e io men e e e idas, u iliza a aplicação na e en e EPR Médico. Ca a e iza-se pela u ilização simul ânea de desk op e de able , associada a uma a iedade de obje i os no uso da aplicação EPR Mul ipla a o ma. Tal como as es an es pe sonas, em o obje i o de egis a in o ma icamen e odas as a e as na aplicação em causa, mas des aca algumas dessas a e as como sendo mais ele an es, no con ex o da mobilidade: • Funcionalidades da u gência; • Funcionalidades do in e namen o; • Visualização de exames. Fig. 41 Pe sona P imá ia 1 (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 85! 4.3.2 Pe sona P imá ia 2 A segunda pe sona p imá ia iden i icada ( e ig. 42) u iliza a aplicação na e en e EPR En e magem. Tal como a pe sona p imá ia 1, ca a e iza-se pela u ilização simul ânea de desk op e de able , associada a uma a iedade de obje i os no uso da aplicação EPR Mul ipla a o ma. Tem como obje i o egis a odas as a e as que execu a in o ma icamen e. No âmbi o da mobilidade, des acam-se as seguin es: • P epa ação dos doen es pa a exame; • Recob o dos doen es após exame. Fig. 42 Pe sona P imá ia 2 (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 86! 4.3.3 Pe sona secunda ia A pe sona secundá ia que iden i icámos ( e ig. 43) u iliza a aplicação na e en e do médico e dis ingue-se das duas pe sonas p imá ias po u iliza apenas um ipo de disposi i o, no con ac o com a aplicação EPR Mul ipla a o ma – o desk op. Po esse mo i o, a sua u ilização da aplicação é mais limi ada, pois não i a pa ido da mobilidade. Ainda assim, os seus obje i os de u ilização da aplicação são ab angen es, designadamen e: • Na consul a dos doen es da en e ma ia; • Na consul a dos doen es em u gência; • Na ges ão dos gabine es. Fig. 43 Pe sona Secundá ia (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 87! 4.3.4 Pe sona Complemen a A pe sona complemen a iden i icada ( e ig. 44), u iliza a aplicação na e en e EPR En e magem. A sua u ilização é me amen e na pe spe i a de moni o ização dos p o issionais que di ige, não sendo uma u ilizado a egula da mesma. Po es e mo i o, em uma in e ação bas an e limi ada com a aplicação. Fig. 44 Pe sona Complemen a (p oduzida pela au o a). . ESTRATÉGIAS DE DESIGN RESPONSIVO! 88! 4.4 Ci cui os Selecionados A de inição dos ci cui os escolhidos pa a uma análise mais de alhada ( ide Anexo 6: Ci cui os Selecionados), esul ou do c uzamen o dos dados ob idos a a és da análise dos egis os de u ilização e das en e is as ealizadas aos p o issionais de saúde. O p esen e es udo em como oco p incipal a esponsi idade exis en e en e as di e en es pla a o mas (desk op e able ), mo i o pelo qual p i ilegiámos uncionalidades que izessem sen ido no con ex o da mobilidade, sendo usadas nos dois ipos de disposi i os. No con ex o do EPR Médico, cen ámo-nos nas uncionalidades da U gência e do In e namen o, de inindo um ci cui o di e en e, associado a cada uma das e e idas uncionalidades: 1. Consul a e adiciona uma no a clínica a um doen e que se encon e em u gência; 2. Faze uma equisição MCDT a um doen e que se encon e in e nado. No con ex o do EPR En e magem, cen ámo-nos nas uncionalidades das Vigilâncias e das Moni o izações, escolhendo igualmen e um ci cui o associado a cada uma das duas: 1. Al e a igilância associada a um doen e; 2. Al e a moni o ização associada a um doen e. Como se á explicado no Rela ó io dos Tes e de Usabilidade | Fase 1 ( ide 5.1.1.4 Ci cui o Escolhido), pa a o imiza o empo disponí el pa a a e ição de esul ados, possibili ando a melho ia da nossa p opos a de abalho e a ealização de no os es es, oi selecionado um único ci cui o pa a a ealização do es e de usabilidade – Ci cui o 1: Consul a e Adiciona uma No a Clínica ao Doen e 1 da Lis a de Doen es em U gência (EPR Médico Mul ipla a o ma). Dos qua o ci cui os analisados, o Ci cui o 1 é o mais complexo (EPR Médico em uma es u u a mais densa do que o EPR En e magem); encon a-se menos comple o no que espei a à esponsi idade dos seus ec ãs; esol e ques ões de o ganização da na egação numa es u u a uncional complexa (EPR Médico), pe mi e adap a os esul ados ob idos pa a uma es u u a de meno complexidade (EPR En e magem). ESTRATÉGIAS DE DESIGN RESPONSIVO! 89! 5 ESTRATÉGIAS DE RESPONSIVIDADE No p esen e capí ulo ap esen amos uma p opos a de esponsi idade aplicada ao Ci cui o 1 – Consul a e adiciona uma no a clínica a um doen e que se encon e em u gência da e en e médico da aplicação EPR Mul ipla a o ma. O obje i o p incipal é epensa e melho a a expe iência do u ilizado ao ní el na egação nos di e sos disposi i os (desk op, able e sma phone). Pa a além da me odologia de design cen ado no u ilizado , u ilizamos a me odologia mobile i s , que nos pe mi iu esol e à pa ida um conjun o de es ições associadas à pequena dimensão do ec ã do sma phone. Desenha pa a ec ãs ouch implica epensa a o ma como o u ilizado in e age com o sis ema do disposi i o em causa. Pa a isso, emos conside a quais as zonas acessí eis, ou não pelos polega es ( ulga men e usados pelos u ilizado es pa a in e agi com es e ipo de ec ãs). Fig. 45 Os polega es são os dedos mais u ilizados na in e ação com sma phones ( e i ada de Designing o Touch, 2015). ESTRATÉGIAS DE DESIGN RESPONSIVO! 96! 5.1.1.6 Resul ados Ob idos A obse ação do compo amen o dos u ilizado es quando en a am execu a as a e as do ci cui o em causa, pe mi iu-nos a e i que: • A es u u a da na egação es á o ganizada de o ma pouco cla a, sendo u gen e aze al e ações no sen ido de uma melho ia da sua hie a quia; • O con ex o do u ilizado pe de-se ao longo dos sucessi os ec ãs. Is o acon ece especialmen e no caso do sma phone e no able e ical. Fig. 51 Pe da de con ex o de na egação no sma phone. ESTRATÉGIAS DE DESIGN RESPONSIVO! 97! Fig. 52 Pe da de con ex o de na egação no able e ical. 5.1.1.7 Inqué i o Sys em Usabili y Scale (SUS) Op ou-se po u iliza a Sys em Usabili y Scale, uma escala consensualmen e usada em Tes es de Usabilidade, pa a a e i a sa is ação dos u ilizado es. Os g á icos que se seguem ilus am a sua opinião ela i amen e à usabilidade da nossa p opos a pa a a aplicação EPR Mul ipla a o ma. A escala é g adual e es á comp eendida en e os alo es 1 (Disco do comple amen e) e 5 (Conco do o almen e). Fig. 53 Pode ia usa es a aplicação equen emen e (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 98! Fig. 54 Achei a aplicação desnecessa iamen e complexa (p oduzida pela au o a). Fig. 55 Achei que a aplicação e a ácil de usa (p oduzida pela au o a). Fig. 56 I ia p ecisa do apoio de um écnico pa a se capaz de u iliza a aplicação (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 99! Fig. 57 Achei que as á ias unções da aplicação es a am bem in eg adas (p oduzida pela au o a). Fig. 58 Pa eceu-me ha e mui a inconsis ência na aplicação (p oduzida pela au o a). Fig. 59 Imagino que a maio ia das pessoas i ia ap ende a u iliza es a aplicação mui o apidamen e (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 100! Fig. 60 Achei a aplicação mui o complicada de usa (p oduzida pela au o a). Fig. 61 Sen i-me mui o con ian e ao usa a aplicação (p oduzida pela au o a). Fig. 62 P ecisa a de ap ende bas an e an es de pode começa a usa a aplicação (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 101! 5.1.2 Rela ó io do Tes e de Usabilidade | Fase 2 5.1.2.1 Me odologia A segunda ase do es e de usabilidade da nosso p opos a pa a aplicação EPR Mul ipla a o ma oi ealizada nos dias 7 e 8 de Junho de 2016, nas ins alações da Glin e em casa de dois pa icipan es anónimos. Pa icipa am nes e es e qua o elemen os da equipa de Design da Glin e dois es udan es da Faculdade de Engenha ia da Uni e sidade do Po o. Tal como na ase 1, o am ealizados es es de ca á e o ma i o, de aco do com a ase e a na u eza da nossa p opos a ( ide 5.1.1 Rela ó io do Tes e de Usabilidade | Fase 1, 5.1.1.1 Me odologia). 5.1.2.2 Obje i o do Tes e de Usabilidade Sendo o nosso oco de es udo a na egação da aplicação EPR Mul ipla a o ma, p e endemos comp eende de que o ma os u ilizado es in e agem com o sis ema, ao ní el da na egação do mesmo. Man endo o obje i o do es e ealizado na ase 1, p e endemos e colma adas as alhas de e adas no deco e do mesmo: • A es u u a da na egação encon a a-se, numa p imei a ase, o ganizada de uma o ma pouco cla a. Fo am ei as al e ações na sua es u u a, no sen ido de uma melho ia da hie a quia da mesma; • O con ex o do u ilizado pe dia-se ao longo dos sucessi os ec ãs. Tal acon ecia especialmen e no caso do sma phone. 5.1.2.3 Pa icipan es Não ha endo possibilidade de ealiza o es e no con ex o eal de u ilização do EPR Mul ipla a o ma, eco emos, al como na ase 1, à equipa esponsá el pela sua c iação: ês designe s da Glin HS e uma consul o a, odos elemen os da equipa de P odu o. Simul aneamen e, pa icipa am no es e em causa dois colegas, es udan es da Faculdade de Engenha ia da uni e sidade do Po o. Todos os pa icipan es es ão bas an e à on ade no uso de ecnologias. O ESTRATÉGIAS DE DESIGN RESPONSIVO! 102! p imei o g upo de pa icipan es encon a-se amilia izado com a aplicação em causa, ao con á io do segundo g upo. 5.1.2.4 Disposi i os Sendo o p incipal obje i o do p esen e abalho o es udo da esponsi idade da aplicação EPR Mul ipla a o ma, o es e incluiu amewo ks esponsi as do ci cui o escolhido desenhadas pa a os seguin es disposi i os: • Sma phone (iPhone); • Table (iPad ho izon al e e ical); • Desk op. 5.1.2.5 Ci cui o escolhido Pa a o imiza o empo disponí el pa a a e ição de esul ados, possibili ando a melho ia da nossa p opos a de abalho e a ealização de no os es es, oi selecionado o mesmo pe cu so u ilizado na an e io ase de es es – Ci cui o 1: Consul a e Adiciona uma No a Clínica ao Doen e 1 da Lis a de Doen es em U gência (EPR Médico Mul ipla a o ma). Os mo i os pa a a escolha des e ci cui o man i e am-se ( ide 5.1.1 Rela ó io do Tes e de Usabilidade | Fase 1, 5.1.1.5 Ci cui o Escolhido). 5.1.2.6 Resul ados Ob idos A obse ação do compo amen o dos u ilizado es quando en a am execu a as a e as do ci cui o em causa, pe mi iu-nos a e i que: • Hou e uma melho ia signi ica i a no con ex o de na egação, pelo que os u ilizado es já não ap esen am di iculdade em a ingi o obje i o p opos o, nesse âmbi o; • Os u ilizado es demons a am alguma di iculdade em descob i o bo ão e e en e às uncionalidades con ex ualizadas do doen e (pa a acede às “No as Clínicas” do mesmo); • Ou a di iculdade demons ada pela gene alidade dos u ilizado es diz ESTRATÉGIAS DE DESIGN RESPONSIVO! 103! espei o à ação “Vol a ”, uma ez selecionada a “No a Clínica 1”, pa a ol a à lis a das No as Clínicas; • Ao con á io do que se ia de espe a , o am de e adas di iculdades semelhan es nos dois g upos dis in os de u ilizado es. Fig. 63 Melho ia signi ica i a no con ex o de na egação em sma phone (p oduzida pela au o a). Fig. 64 Uma ez selecionada a “No a Clínica 1”, os u ilizado es demons a am di iculdade em ol a pa a a lis a No as Clínicas. ESTRATÉGIAS DE DESIGN RESPONSIVO! 104! 5.1.2.7 Inqué i o Sys em Usabili y Scale (SUS) Os g á icos que se seguem ilus am a opinião dos u ilizado es, ela i amen e à usabilidade da nossa p opos a pa a a aplicação EPR mul ipla a o ma. A escala é g adual e es á comp eendida en e os alo es 1 (Disco do comple amen e) e 5 (Conco do o almen e). Fig. 65 Pode ia usa es a aplicação equen emen e (p oduzida pela au o a). Fig. 66 Achei a aplicação desnecessa iamen e complexa (p oduzida pela au o a). Fig. 67 Achei que a aplicação e a ácil de usa (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 105! Fig. 68 I ia p ecisa do apoio de um écnico pa a se capaz de u iliza a aplicação (p oduzida pela au o a). Fig. 69 Achei que as á ias unções da aplicação es a am bem in eg adas (p oduzida pela au o a). Fig. 70 Pa eceu-me ha e mui a inconsis ência na aplicação (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 112! Fig. 80 P imei os ní eis de na egação local nos di e en es disposi i os (p oduzida pela au o a) O úl imo ní el da na egação local diz espei o a ações especí icas das uncionalidades selecionadas. Localiza-se la e almen e, em desk op e able ho izon al e no undo do ec ã, em able e ical e sma phone ( e ig. 81). Pa a esol e as condicionan es in ínsecas ao sma phone, designadamen e o pouco espaço de ec ã disponí el, op ámos esconde a na egação local num bo ão que a e ela quando necessá io ( e ig. 82). ESTRATÉGIAS DE DESIGN RESPONSIVO! 113! Fig. 81 Úl imo ní el da na egação local nos di e en es disposi i os (p oduzida pela au o a). Fig. 82 P opos a de solução pa a “mais ações” em sma phone: bo ão que expande, mos ando mais opções de ações possí eis (p oduzida pela au o a). Quando a uncionalidade “No a Clínica” é selecionada, es a unciona como um i em ex ensí el, e elando as suas in o mações sem sai da lis a e ical que a inclui ( e ig. 83). ESTRATÉGIAS DE DESIGN RESPONSIVO! 114! Fig. 83 P opos a de solução pa a o ec ã “No a Clínica Selecionada” (p oduzida pela au o a). Fig. 84 P opos a de ec ã “Adiciona No a Clínica” nos di e en es disposi i os (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 115! A p opos a inal cons i ui uma melho ia signi ica i a ela i amen e às duas an e io es. Consegue soluciona : • A o ganização da hie a quia da na egação, que se ap esen a de uma o ma cla a; • A con ex ualização do u ilizado , que em semp e e e ência dos sucessi os ní eis de na egação selecionados, localizando-se; • A e gonomia nos di e en es ec ãs, pois odos es ão desenhados pa a que os bo ões sejam acessí eis aos polega es. O ci cui o comple o, nos di e en es disposi i os, pode se acedido aqui: iPhone: h ps://ma elapp.com/1bhbde8 iPad Ho izon al: h ps://ma elapp.com/22a4j7e iPad Ve ical: h ps://ma elapp.com/67a74eg Desk op: h ps://ma elapp.com/67a dcg ESTRATÉGIAS DE DESIGN RESPONSIVO! 116! 6 CONCLUSÃO 6.1 Sa is ação dos Obje i os A p esen e disse ação em como obje i o p incipal delinea es a égias de esponsi idade pa a um caso de especí ico: a aplicação web EPR Mul ipla a o ma, da Glin Globalca e. A aplicação em causa não oi concebida de aiz pa a se adap a a di e en es disposi i os nem às suas esoluções, con endo ec ãs desenhados de o ma semelhan e pa a os di e en es supo es. Pa indo do es udo ap o undado dos concei os de design esponsi o e de pad ões de design e sus en ando-nos numa me odologia de design cen ado no u ilizado , omos capazes de analisa e iden i ica pon os de melho ia no caso de es udo. O p imei o pon o de melho ia iden i icado diz espei o à es u u a de na egação do caso de es udo. A a és da análise da es u u a da sua hie a quia uncional, iden i icámos seis ní eis hie á quicos na e en e médico e cinco, na e en e de en e magem. Ambas as e en es da aplicação es ão o ganizadas segundo es u u as densas que con êm mui a quan idade de in o mação. A na egação es á o ganizada de uma o ma pouco cla a e in ui i a, já que os sucessi os ní eis da hie a quia ão subs i uindo os an e io es. O segundo pon o que iden i icámos oi a descon ex ualização do u ilizado . A al a de hie a quia na es u u a de na egação em epe cussões signi ica i as na expe iência do u ilizado . O a o de na egação o na-se con uso, já que o u ilizado pe de con ex o à medida que pe co e os di e en es ní eis hie á quicos da aplicação. En e is as ealizadas a ce ca de oi o u ilizado es inais da aplicação ie am ajuda a con i ma ais agilidades. Ou a necessidade de melho ia iden i icada oi a de desenha os di e sos ec ãs pa a a in e ação a a és do oque. De ac o, os elemen os de na egação não es ão colocados de o ma e gonómica, já que es ão semp e na mesma posição independen emen e do disposi i o em causa ou da sua o ien ação. Com o obje i o de esol e os pon os a ás iden i icados, ealizámos uma p opos a p á ica pa a o Ci cui o 1: Consul a e Adiciona uma No a Clínica ao Doen e 1 da Lis a de Doen es em U gência (EPR Médico Mul ipla a o ma). Dada a complexidade do ci cui o escolhido, assim como a es u u a base da aplicação, é possí el aplica es a o ganização aos es an es ci cui os do EPR Mul ipla a o ma. A me odologia de design cen ado no u ilizado e elou-se essencial pa a a cons ução da p opos a inal. Os es es de usabilidade ealizados com os u ilizado es ESTRATÉGIAS DE DESIGN RESPONSIVO! 117! o am de e minan es pa a iden i ica pon os de melho ia, e le indo-se numa cons an e e olução das sucessi as ases de abalho. Pa alelamen e, a adoção da me odologia de design mobile i s , pe mi iu-nos o imiza o empo de abalho, iden i icando os maio es cons angimen os numa ase inicial da p opos a p á ica. A p opos a inal es á cons uída de aco do com as seguin es linhas condu o as: o ganiza a na egação semp e e le indo a hie a quia do sis ema em causa; cla i ica o con ex o do u ilizado , p i ilegiando a sua o ien ação à medida que pe co e os di e sos ní eis da hie a quia; u iliza pad ões de design esponsi os no desenho dos elemen os uncionais que compõem os di e sos ec ãs; localiza os elemen os de na egação em zonas e gonómicas, p epa ando odos os disposi i os pa a a in e ação a a és do oque. As es a égias a ás iden i icadas cons i uem linhas o ien ado as que podem se aplicadas a qualque sis ema. A aplicação de di e izes esponsi as, assim como de uma me odologia cen ada no u ilizado , e elam-se undamen ais pa a melho a a expe iência do u ilizado . 6.2 Limi ações e T abalho Fu u o As p incipais limi ações encon adas ao longo do p esen e p oje o de in es igação o am a impossibilidade de ealiza inqué i os e es es de usabilidade aos u ilizado es inais do EPR Mul ipla a o ma. Simul aneamen e, o limi e de empo impediu-nos de eplica a p opos a dos wi e ames inais nos es an es ci cui os selecionados. Pa ece-nos que a p opos a poe se acilmen e adap ada aos mesmos, no en an o, al hipó ese não oi es ada. O p esen e abalho cen ou-se numa ques ão especí ica da abo dagem esponsi a: a na egação. Seguindo a mesma linha condu o a, u u amen e pode iam se ap o undadas ou as p oblemá icas, designadamen e: a inse ção e edição de dados no sis ema ou a iconog a ia. Seguindo um io condu o di e en e, mas igualmen e ele an e no âmbi o do design enquan o disciplina, se ia a comp eensão da e olução da ecnologia enquan o condicionan e do design. A a és da análise da e olução da aplicação ao longo das suas di e en es e sões, es abelece um pa alelismo en e design e ecnologia, disse ando sob e a sua in e dependência. BIBLIOGRAFIA ACM SIGCHI. 1992. Cu icula o Human-Compu e In e ac ion. New Yo k, New Yo k: The Associa ion o Compu ing Machine y. Adams, Came on. 2004. “Resolu ion Dependen Layou .” h p://www. hemaninblue.com/w i ing/pe spec i e/2004/09/21/. 29 de Dezemb o 2015. Alexande , Ch is ophe . 1973. No es on he Syn hesis o Fo m. London: Ox o d Uni e si y P ess. doi:64-13417. ———. 1977. A Pa e n Language: Towns, Buildings, Cons uc ion. New Yo k, New Yo k: Ox o d Uni e si y P ess. Allen, Ryan. 2014. “Responsi e Type and Mo e Wi h Only CSS.” h ps://medium.com/@ yanallen_com/ esponsi e- ype-wi h-only-css- 82b846370cc9#.x41sd x8. 22 de Junho 2016. Apple Inc. “Designing o iOS.” ios Human In e ace Guidelines, h ps://de elope .apple.com/lib a y/ios/documen a ion/Use Expe ience/Concep u al/MobileHIG/. 22 de Junho 2016. Baecke & Bux on. 1987. “Readings in Human-Compu e In e ac ion: A Mul idisciplina y App oach.” San Ma eo: Mo gan Kau mann Publishe s. Beh ens, Ch is ian. 2008. “In o Design Pa e ns.” h p://www.niceone.o g/in odesignpa e ns/index.php5#/pa e ns.php5. 4 de Janei o 2016. Bo che s, Jan O. 2000. “A Pa e n App oach o In e ac ion Design.” New Yo k. h ps://hci. w h-aachen.de/ma e ials/publica ions/bo che s2000a.pd . 4 de Janei o 2016. Boul on, Ma k. 2012. “A New Canon.” h p://www.ma kboul on.co.uk/jou nal/anewcanon. 4 de Janei o de 2016. Ca alhais, Miguel. 2008. “Lea ning and S udying In e ac ion Design h ough Design Pa e ns. In oduc ion & Con ex .” PLoP. Nash ille, TN. Cla k, Josh. 2015. Designing o Touch. The Mobile Book. New Yo k, New Yo k: A Book Apa . Coope , Alan, Robe Reinmann and Da id C onin. 2007. Abou Face 3.0: The Essen ials o In e ac ion Design. In o ma ion Visualiza ion. 4 h ed. Vol. 3. Indianopolis, Indiana: John Wiley & Sons, Inc. doi:10.1057/palg a e.i s.9500066. C umlish, Ch is ian and E in Malone. 2009. Designing Social In e aces: P inciples, Pa e ns, and P ac ices o Imp o ing he Use Expe ience. Sebas opol, Cali o nia: O’Reilly Media, Inc. "Ema ke ee ". 2014. h p://www.ema ke e .com/A icle/Sma phone-Use s- Wo ldwide-Will-To al-175-Billion-2014/1010536. 22 de Junho 2016. Gamma, E ich, Richa d Helm, Ralph Johnson and John Vlissides. 1994. Design Pa e ns: Elemen s o Reusable Objec -O ien ed So wa e. Edi ed by Addison-Wesley P o essional. 1s ed. Massachuse s. doi:10.1093/ca cin/bgs084. Google. 2015. “Google Ma e ial Design Guidelines.” 2016. h ps://www.google.com/design/spec/pa e ns/da a- o ma s.h ml#. 22 de Junho 2016. Hoekman, J . Robe . ·. 2009. “The My h o Usabili y Tes ing.” Usabili y, Use Resea ch . h p://alis apa .com/a icle/ he-my h-o -usabili y- es ing. 22 de Junho 2016. Hoobe , S e en, and E ic Be kman. 2011. Designing Mobile In e aces. Sebas opol, Cali o nia: O’Reilly Media, Inc. Ins i u o Supe io Técnico. 2010. “Banco de Pad ões de Design.” doi:h p://bpd.is .u l.p /. 1 de janei o 2016. “In e ac ing wi h Compu e s.” 1987. In e ac ing wi h Compu e s. h ps://iwc.ox o djou nals.o g. 22 de Junho 2016. Jones, Pe e H. 2013. Design o Ca e: Inno a ing Heal hCa e Expe ience. Edi ed by Rosen eld Media. B ooklyn, New Yo k: Louis Rosen eld. www. osen eldmedia.com. Kalbach, James. 2008. Designing Web Na iga ion. Sebas opol, Cali o nia: O’Riley Media. K ug, S e e. 2014. Don’ Make Me Think, Re isi ed: A Common Sense App oach o Web Usabili y. Edi ed by Elisabe h Bayle. Thi d. US. www.new ide s.com. Lea y, B ian. 2010. “Design Thinking – a New Men al Model o Value Inno a ion.” S a egy & Leade ship 38 (3). S an o d Social Inno a ion Re iew [In e ne ]: 5–14. doi:10.1108/10878571011042050. Leech, Joe. 2015. “How o Do a UX Re iew.” UX. h ps://24ways.o g/2015/how- o-do-a-ux- e iew/. 22 de Junho 2016. Ma co e, E han. 2009. “Uns opabble Robo Ninja - Fluid Images.” h p://uns oppable obo ninja.com/en y/ luid-images/. 22 de Junho 2016. ———. 2010. “A Lis Apa - Responsi e Web Design.” h p://alis apa .com/a icle/ esponsi e-web-design. 22 de Junho 2016. ———. 2011. Responsi e Web Design. New Yo k: A Book Apa . ———. 2015. Responsi e Web Design: Pa e ns and P inciples. New Yo k: A Book Apa . McG ane, Ka en. 2012. Con en S a agy Fo Mobile. New Yo k: A Book Apa . Mi chell, Ma k. 2015. “Designing wi h Con as .” Design . h ps://24ways.o g/2015/designing-wi h-con as /. 22 de Junho 2016. Mo an, Thomas. 1981. “Thomas P. Mo an The Command Language G amma : A Rep esen a ion o he Use In e ace o In e ac i e Compu e Sys ems.” In e na ional Jou nal o Man-Machine S udies. Mosby’s Medical Dic iona y. 2009. Else ie . Mulle -B ockmann, Jose . 1961. G id Sys ems In G aphic Design: A Visual Communica ion Manual o G aphic Designe s, Typog aphe s and Th ee Dimensional Designe s. h p://schola .google.com/schola ?hl=en&b nG=Sea ch&q=in i le:G id+Sys ems+i n+G aphic+Design#8 nh p://schola .google.com/schola ?hl=en&b nG=Sea ch&q =in i le:G id+Sys ems+In+G aphic+Design#8. 23 de dezemb o 2015. Neil, The esa. 2012. Mobile Design Pa e n Galle y. Sebas opol, Cali o nia: O’Riley Media. No man, Don. 2013. The Design o E e yday Things. New Yo k, New Yo k: Basic Books. No man, Donald and Robe o Ve gan i. 2014. “Inc emen al and Radical Inno a ion: Design Resea ch Ve sus Technology and Meaning Change Robe o Ve gan i -Bio.” Design Issues, 30(1), 78-96. www. e gan i.com. Pa e n Fac o y. 2009. “Pa e n y Open Lib a y.” h p://pa e n y.com. 22 de Junho 2016. Ribei o, Jo ge. 2012. “Web Design Pa e ns o Mobile De ices,” no. July: 158. h p:// eposi o io-abe o.up.p /handle/10216/64860. 22 de Junho 2016. Schümme , Till, and S ephan Lukosch. 2007. Pa e ns o Compu e -Media ed In e ac ion. Chiches e , England: Wiley Publishing. Sco , Bill, and The esa Neil. 2009. Designing Web In e aces: P inciples and Pa e ns o Rich In e ac ions. Sebas opol, Cali o nia: O’Reilly Media. Tidwell, Jeni e . 1999. “Common G ound: A Pa e n Language o Human-Compu e In e ace Design.” h p://www.mi .edu/~j idwell/common_g ound.h ml. ———. 2010. Designing In e aces. Canada: O’Reilly Media. Toxboe, Ande s. 2007. “UI Pa e ns.” h p://ui-pa e ns.com/. an Duyne, Douglas K., James A. Landay, and Jason I. Hong. 2002. The Design o Si es: Pa e ns o C ea ing Winning Websi es. 2nd ed. New Je sey: Uppe Saddle Ri e . W3C. 2012. “Media Que ies: W3C Recommenda ion 19 June 2012.” h p://www.w3.o g/TR/css3-mediaque ies/. 22 de Junho 2016. ———. 2015. “G ace ul Deg ada ion e sus P og essi e Enhancemen .” h ps://www.w3.o g/wiki/G ace ul_deg ada ion_ e sus_p og essi e_enhancemen . 22 de Fe e ei o de 2015. W oblewski, Luke. 2011. Mobile Fi s . 6 h ed. New Yo k: A Book Apa . Yahoo. 2006. “Yahoo Design Pa e n Lib a y.” h ps://de elope .yahoo.com/ypa e ns/abou /. 22 de Junho 2016. Página de Login EPR Médico EPR En e magem Bloco Ope a ó io Consul a In e namen o U gência No ificações Rela ó ios Ta e as Á R E A S F U N C I O N A I S F U N C I O N A L I D A D E S Lis a de Doen es em Bloco Ope a ó io Lis a de Doen es em In e namen o Lis a de No ificações Lis a de Doen es em Consul a Lis a de Doen es em U gência Lis a de Rela ó ios Lis a de Ta e as Doen e Selecionado Lemb e es Adicionados Ta e a Selecionada Doen e Selecionado Doen e Selecionado Doen e Selecionado Ta e as do Doen e V I S Ã O C O N T E X T U A L I Z A D A V I S Ã O D E S C O N T E X T U A L I Z A D A Rela ó ios His ó ico Clínico No as Clínicas P opos a Ci ú gica Pedido de In e namen o P esc ição Ex e na Diagnós ico e P oblemas P esc ição In e na Requisição MCDT Pedido de Consul a P óxima Consul a Al a Clínica Regis o MCDT Ale gias Dados Demog áficos PIM Ta e as V I S Ã O D E S C O N T E X T U A L I Z A D A V I S Ã O C O N T E X T U A L I Z A D A Lis a de Episódios do Doen e Especificação dos Episódios No as Clínicas do Doen e Lis a de P oblemas do Doen e eResul s Moni o izações Lis a de Documen os disponí eis no eposi ó io eResul s Lis a das Moni o izações do Doen e Lis a das P opos as Ci ú gicas do Doen e In o mação Clínica In o mação Ge al Ou os Lis a dos Pedidos de In e namen o P esc ição de disposi i os Lis a de Requisições Dados Ge ais da P esc ição Resumo Medicamen os I ems não medicamen os Die a Lis a de MCDTs egis ados Lis a de Pedidos de Consul a Ma cação de Consul as Finalização da Al a Clínica Em desen ol imen o Em desen ol imen o Dados demog áficos do Doen e Ta e as associadas ao Doen e Lis a de Ta e as de odos os Doen es Associa no a a e a ao Doen e Especificação dos P oblemas Lis a de Rela ó ios do Doen e In o mação Ge al Especificação dos Pedidos Especificação das Requisições Fig. 87 O ganog ana Funcional EPR Médico Mul ipla a o ma (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 129! Anexo 4: O ganog ama Funcional EPR En e magem Mul ipla a o ma Página de Login EPR En e magem EPR Médico Lis a de Doen es Ca déx Moni o izações Vigilâncias Doen e Selecionado Lis a da Medicação a se alidada de odos os Doen es Lis a de Moni o izações de odos os Doen es Lis a de Vigilâncias de odos os Doen es SOS Ho as Camas His ó ico Clínico Plano do Doen e Regis o de Consumos A aliação Inicial Ve ificação P é-Ci ú gica Ve ificação Pós-Ci ú gica Lis a de Episódios do Doen e Episódio Selecionado Lis a de Medicações do Doen e Não Adminis ação Adminis ação Em cu so Obse ações Anula Lis a de Ta e as Pós-Ci ú gicas Documen os Associados Lis a de Ta e as P é-Ci ú gicas Documen os Associados Inse i Consumos do Doen e In o mação do Doen e In o mação Clínica Ma ca Código P odu o V I S Ã O D E S C O N T E X T U A L I Z A D A V I S Ã O D E S C O N T E X T U A L I Z A D A V I S Ã O C O N T E X T U A L I Z A D A V I S Ã O C O N T E X T U A L I Z A D A Fig. 88 O ganog ama Funcional EPR En e magem Mul ipla a o ma (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 131! Anexo 5: En e is as aos p o issionais da Glin ESTRATÉGIAS DE DESIGN RESPONSIVO! 132! Fig. 89 En e is a a Paulo Co eia (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 133! Fig. 90 En e is a a Mau ícia Cas o (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 134! Fig. 91 En e is a a Miguel Cas o (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 135! Fig. 92 En e is a a F ancisco Vicen e (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 136! Fig. 93 En e is a a Rui Gou eia (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 137! Fig. 94 En e is a a Hélde Pai a (p oduzida pela au o a). Página de Login EPR En e magem EPR Médico SOS Ho as Camas V I S Ã O D E S C O N T E X T U A L I Z A D A V I S Ã O D E S C O N T E X T U A L I Z A D A V I S Ã O C O N T E X T U A L I Z A D A V I S Ã O D E S C O N T E X T U A L I Z A D A Moni o izações Lis a de Moni o izações de odos os Doen es Fig. 100 Ci cui o 2 EPR En e magem: Al e a moni o ização associada a um doen e (p oduzida pela au o a). ESTRATÉGIAS DE DESIGN RESPONSIVO! 145! Anexo 7: Wi e ames Finais Fig. 101 P opos a pa a a página de login do EPR Mul ipla a o ma (p oduzida pela au o a). Fig. 102 P opos a pa a a página inicial de uncionalidades, do EPR Mul ipla a o ma (p oduzida pela au o a). Fig. 103 P opos a pa a a página de uncionalidades “doen es em u gência”, do EPR Mul ipla a o ma (p oduzida pela au o a). Fig. 104 P opos a pa a a página “doen e em u gência selecionado” do EPR Mul ipla a o ma (p oduzida pela au o a). Fig. 105 P opos a pa a página “No as Clínicas do doen e selecionado” da aplicação EPR Mul ipla a o ma (p oduzida pela au o a). Fig. 106 P opos a pa a a página “No a Clínica selecionada” da aplicação EPR Mul ipla a o ma (p oduzida pela au o a). Fig. 107 P opos a pa a página “Vol a No as Clínicas” do EPR Mul ipla a o ma (p oduzida pela au o a). Fig. 108 P opos a de sucessão de ec ãs em sma phone “Mais ações” do EPR Mul ipla a o ma (p oduzida pela au o a).