Design da travessia do utilizador para a aplicação de software do projeto CHIC baseada em localização

MESTRADO MULTIMÉDIA - ESPECIALIZAÇÃO EM CULTURA E ARTES DESIGN DA TRAVESSIA DO UTILIZADOR PARA A APLICAÇÃO DE SOFTWARE DO PROJETO CHIC BASEADA EM LOCALIZAÇÃO Dan Martini Campos Bueno M 2021 FACULDADES PARTICIPANTES: FACULDADE DE ENGENHARIA FACULDADE DE BELAS ARTES FACULDADE DE CIÊNCIAS FACULDADE DE ECONOMIA FACULDADE DE LETRAS 2 Design da Travessia o do Utilizador para a Aplicação de Software do Projeto CHIC Baseada em Localização Dan Martini Campos Bueno Mestrado em Multimédia da Universidade do Porto Orientador: Pedro Cardoso (Professor Auxiliar) Coorientadora: Andreia Pinto de Sousa (Professora Auxiliar Convidada) Junho de 2021 3 Página intencionalmente em branco. 4 © Dan Martini Campos Bueno, 2021 Design da Travessia do Utilizador para a Aplicação de Software do Projeto CHIC Baseada em Localização Dan Martini Campos Bueno Mestrado em Multimédia da Universidade do Porto Aprovado em provas públicas pelo Júri: Presidente: Bruno Giesteira (Professor Auxiliar) Vogal Externo: Ricardo Melo (Professor Adjunto Convidado) Orientador: Pedro Cardoso (Professor Auxiliar) 5 Página intencionalmente em branco. 6 Resumo Segundo Cardoso, numa narrativa interativa, o utilizador vivencia uma experiência pessoal e única, desenvolvendo a sua travessia dentro do panorama ergódico da topologia do sistema. Para os autores Cardoso e Carvalhais, a travessia pode ser entendida como a jornada do utilizador entre as tensões dinâmicas de dois tipos de narrativas: a narrativa hardcoded – fixa e pré-determinada – e a narrativa emergente – que surge da interação entre o utilizador/ jogador e o sistema. Este conceito é aplicado no âmbito do projeto CHIC, realizado em parceria com várias entidades nomeadamente a FEUP, a Gema Digital, a Universidade Católica Portuguesa e o Jornal de Notícias, que visa o estudo e o desenvolvimento de uma ferramenta de autoria baseada na localização para fornecer experiências focadas na exploração de pontos de interesse turísticos de forma lúdica. Este estudo explora a relação entre o utilizador e o sistema, com foco nestas narrativas. Através desta relação, esta investigação visa estudar as diversas aplicações dos vários tipos de travessia ao sistema digital do projeto CHIC, assim como detetar novos tipos de travessia ainda não previstos. O método de investigação é baseado no levantamento de sistemas de autoria como casos de estudo em conjunto com o desenvolvimento de um protótipo da ferramenta de autoria e testes de usabilidade com participantes. Os resultados do estudo promovem o design de narrativas interativas e o entendimento de como desenhar as travessias. O estudo propõe uma solução para o design da travessia do utilizador no âmbito do projeto CHIC e fomenta soluções para narrativas focadas no turismo e património. Palavras-chave: Narrativas Interativas; Travessia; Design de Narrativa; Interação; Experiência do Utilizador. 7 Página intencionalmente em branco. 8 Abstract According to Cardoso, in an interactive narrative, the user lives a personal and unique experience, developing their journey within the ergodic panorama of the system's topology. For Cardoso and Carvalhais, traversal can be understood as the user's journey between the dynamic tensions of two types of narratives: the hardcoded narrative — fixed and pre-determined — and the emergent narrative — that emerges from the interaction of the user / player with the system. This concept is applied in the context of the CHIC project, carried out in collaboration between FEUP, Gema Digital, Universidade Católica Portuguesa and Jornal de Notícias, which aims the study and the development of a location-based authoring tool to provide experiences for the exploration of tourist points in a ludic way. This study explores the relationship between the user and the system, focusing on these narratives. Through this relationship, this investigation aims to study different applications of the various types of traversals in the digital system of the CHIC project, as well as detecting new types of traversals that have not been foreseen. The investigation method is based on the gathering of authoring systems as case studies alongside with the development of a prototype of the authoring tool and usability tests with serious participants. The study results promote the design of interactive narratives and the understanding of how to design the traversals. The study proposes a solution for the design of the user’s traversal under the CHIC project and promotes solutions for narratives focused on tourism and historic heritage. Keywords: Interactive Narratives; Traversal; Narrative Design; Interaction; User Experience. . 9 Página intencionalmente em branco. 16 Lista de Figuras Figura 1.1: Tipos de Estruturas de Narrativas por Marie-Laurie Ryan (2001) ..................................... 36 Figura 1.2: The Foldback Plot por Ernest W. Adams (2012) ............................................................... 37 Figura 1.3: Mapa completo do nível 1:1 de Super Mario Bros. (1985). ............................................... 49 Figura 1.4: Imagem do jogo de cartas Gwent em The Witcher 3: Wild Hunt (2015). .......................... 49 Figura 1.5: Imagem de um diálogo no jogo The Walking Dead (2012). .............................................. 50 Figure 1.6: Ecrã de criação da origem do personagem em Dragon Age Origins (2009). ..................... 51 Figura 1.7: Novo Jogo + em The Witcher 3: The Wild Hunt (2015). ................................................... 51 Figura 1.8: falha Blue Hell em Grand Theft Auto: San Andreas (2004). ............................................. 52 Figura 2.1: Plataformas das ferramentas de autoria na amostra ............................................................ 58 Figura 2.2: Interface com representação de nós e grafos em articy:draft 3 (2014). ............................. 59 Figura 2.3: Interface com representação de nós e grafos em Eko Studio (2010). ................................. 60 Figura 2.4: Interface do inklewriter free (2011).................................................................................... 61 Figura 2.5: Interface do modo Arte de Mario Paint (1992) .................................................................. 62 Figura 2.6: Interface do modo Música de Mario Paint (1992). ............................................................ 63 Figura 2.7: Interface da aplicação RPG Maker MV (2015). ................................................................. 64 Figura 2.8: Interface Stornaway.io (2019). ........................................................................................... 65 Figura 2.9: Barra de tarefas do Story Speaker (2017) junto ao editor de texto Google Docs (2005). .. 66 Figura 2.10: Interface do StoryMapJS (2017). ...................................................................................... 67 Figura 2.11: Interface com uso de mapa em Story Places (2015)......................................................... 68 Figura 2.12: Restrições da narrativa em Story Places (2015). .............................................................. 69 Figura 2.13: Interface do videojogo Super Mario Maker 1 (2015). ...................................................... 70 Figura 2.14: Listas em círculos em Super Mario Maker 2 (2019). ....................................................... 70 Figura 2.15: Interface de The Adventures of Batman & Robin Cartoon Maker (1995). ....................... 71 Figura 2.16: Interface com representação de nós e grafos em Twine (2009). ....................................... 72 Figura 2.17: Interface com representação de nós e grafos em Twine (2009). ...................................... 75 Figura 2.18: Exemplo de Ferramentas ao alcance da mão no RPG Maker MV (2015). ....................... 77 Figura 2.19: Exemplo de Manipulação direta sem ter de pedir permissão no Super Mario Maker 1 (2015). ................................................................................................................................................... 78 Figura 2.20: Exemplo do princípio de Predefinição no Eko Studio (2015). ......................................... 78 Figura 2.21: Exemplo de Predefinição no Story Speaker (2017). ......................................................... 79 Figura 2.22: Exemplo de Hierarquia do Mario Paint (1992). ............................................................... 81 Figura 2.23: Exemplo de Prevenção dos erros ou tolerância — Prevenção do Stornaway.io (2019). .. 81 Figura 2.24: Exemplo de Prevenção dos erros ou tolerância — Proteção do inklewriter free (2011). . 82 Figura 2.25: Exemplo de Prevenção dos erros ou tolerância — Informação do Eko Studio (2015). .... 82 17 Figura 2.26: Exemplo de Restrição de âmbito do StoryPlaces (2015)). ............................................... 83 Figura 2.27: Exemplo de Afinidade no Story Speaker (2017). ............................................................. 85 Figura 2.28: Exemplo de Causa-efeito no Eko Studio (2010). .............................................................. 86 Figura 2.29: Exemplo de Relação esforço/recompensa no RPG Maker MV (2015). ............................ 87 Figura 2.30: Exemplo de Construção Incremental no Twine (2009). ................................................... 90 Figura 2.31: Exemplo de Gratificação Instantânea no inklewriter free (2011). .................................... 90 Figura 2.32: Exemplo do padrão Exploração Segura através das funcionalidades Desfazer/Refazer no articy:draft 3 (2014). ............................................................................................................................ 91 Figura 2.33: Exemplo do padrão Repetição Simplificada no Eko Studio (2010). ................................ 91 Figura 2.34: Exemplo de uso dos Canvas mais Paleta e Palco Central no The Adventures of Batman & Robin - Cartoon Maker. ........................................................................................................................ 92 Figura 2.35: Exemplo de uso do padrão de barra de ferramentas com a botões de ícones Twine (2011). .............................................................................................................................................................. 93 Figura 2.36: Exemplo de uso dos padrões Painel de tarefas (sidebar) junto ao padrão Painéis Fechados no inklewriter free (2011). .................................................................................................................... 93 Figura 2.37: Exemplo de uso do padrão Wizard no StoryPlaces (2015). ............................................. 94 Figura 2.38: Menu Contextual no articy:draft 3 (2019). ...................................................................... 95 Figura 2.39: Exemplo de uso do padrão Visualização Alternativa no Eko Studio (2015). ................... 95 Figura 2.40: Uso do padrão de Pré-Visualização no inklewriter free (2011). ...................................... 96 Figura 2.41: Uso do drag and drop no Mario Maker (2015). ............................................................... 97 Figura 2.42: Uso do padrão Pilha de Cartas em forma de abas no Storaway.io (2019). ....................... 97 Figura 2.43: Ocorrências dos princípios de design Interação. .............................................................. 98 Figura 2.44: Ocorrências dos princípios de design Arquitetura da Informações. ................................. 99 Figura 2.45: Ocorrências dos princípios de design Experiência de Utilização ..................................... 99 Figura 2.46: Ocorrências das Estratégias de Design de Interação. ..................................................... 101 Figura 2.47: Ocorrências das Estruturas de Design de Interface. ....................................................... 103 Figura 2.48: Ocorrências das estruturas de narrativa em cada sistema levantado. ............................. 107 Figura 2.49: Ocorrências dos níveis de participação do interator nos sistemas levantados. ............... 111 Figura 2.50: Ocorrências das possibilidades de agências nos sistemas .............................................. 115 Figura 2.51: Ocorrências das travessias nos sistemas ......................................................................... 117 Figura 4.1: Mapa de navegação da ferramenta de autoria para o projecto CHIC (2020). .................. 129 Figura 4.2: Fluxo do interator para a criação de experiência na ferramenta de autoria para o projecto CHIC (2020). ...................................................................................................................................... 130 Figura 4.3: Primeira versão do wireframe do Dashboard e menu lateral expandido para a ferramenta de autoria para o projecto CHIC (2020). ................................................................................................. 131 Figura 4.4: Modo de visualização Mapa da ferramenta de autoria para o projecto CHIC (2020). ..... 132 Figura 4.5: Modo de visualização Canvas da ferramenta de autoria para o projecto CHIC (2020). .. 133 18 Figura 4.6: Primeira versão dos menus de configuração da atividade para a ferramenta de autoria para o projecto CHIC (2020). ..................................................................................................................... 134 Figura 4.7: Segunda versão dos menus de configuração da atividade para a ferramenta de autoria para o projecto CHIC (2020). ..................................................................................................................... 134 Figura 4.8: fluxo do interator para a criação de experiência na ferramenta de autoria para o projecto CHIC (2020). ...................................................................................................................................... 135 Figura 4.9: Fluxo do interator para a criação de experiência com exploração livre (2021). ............... 136 Figura 4.10: Fluxo do interator para a criação de experiência com ramificação (2021). .................... 137 Figura 4.11: Design da interface do Dashboard da ferramenta de autoria para o projecto CHIC (2020). ............................................................................................................................................................ 138 Figura 4.12: Painel de configuração inicial de experiência da ferramenta de autoria para o projecto CHIC (2020). ...................................................................................................................................... 139 Figura 4.13: Design da interface do modo Mapa, à direta, e versão com menu lateral ativado, à esquerda, da ferramenta de autoria para o projecto CHIC (2020). ...................................................................... 139 Figura 4.14: Funcionalidade para alterar os modos de visualização (Mapa/Canvas) na interface da ferramenta de autoria para o projecto CHIC (2020). .......................................................................... 140 Figura 4.15: Secções da barra de tarefas da ferramenta de autoria para o projecto CHIC (2020). ..... 140 Figura 4.16: Pré-visualização uma experiência na ferramenta de autoria para o projecto CHIC (2020). ............................................................................................................................................................ 141 Figura 4.17: Fluxo de pré-visualização de atividade através dos Painéis de Pré-visualização na ferramenta de autoria para o projecto CHIC (2020). .......................................................................... 141 Figura 4.18: Publicar uma experiência na ferramenta de autoria para o projecto CHIC(2020). ......... 142 Figura 4.19: Conjuntos de Atividades na interface da ferramenta de autoria para o projecto CHIC(2020). ............................................................................................................................................................ 143 Figura 4.20: Exemplo de uso do conjunto de atividades Branched Set na ferramenta de autoria para o projecto CHIC (2020). ........................................................................................................................ 143 Figura 4.21: Exemplo de uso do conjunto de atividades Cyclic Set na ferramenta de autoria para o projecto CHIC(2020). ......................................................................................................................... 144 Figura 4.22: Exemplo de uso do conjunto de atividades Exploratory Set na ferramenta de autoria para o projecto CHIC (2020). ..................................................................................................................... 144 Figura 4.23: Exemplo de uso do conjunto de atividades MultiModal Set na ferramenta de autoria para o projecto CHIC (2020). ........................................................................................................................ 145 Figura 4.24: Exemplo de uso do conjunto de atividades Expanded Set na ferramenta de autoria para o projecto CHIC(2020). ......................................................................................................................... 146 Figura 4.25: Painel a na ferramenta de autoria para o projecto CHIC(2020). .................................... 147 Figura 4.26: Exemplo de Travessia com Branching (2020). .............................................................. 147 Figura 4.27: Exemplo de Travessia com Bending (2020). .................................................................. 148 19 Figura 4.28: Exemplo de Travessia com Reprinsing (2020). .............................................................. 148 Figura 4.29: Painel de Requisitos na ferramenta de autoria para o projecto CHIC (2020)................. 149 Figura 4.30: Painel de Conquista na ferramenta de autoria para o projecto CHIC (2020). ................ 149 Figura 4.31 Tags nos painéis de configuração gerais da experiência. ................................................ 150 Figura 4.32: Painel de Conquista na ferramenta de autoria para o projecto CHIC (2020). ................ 151 Figuras 5.1 a 5.8: Resultados dos questionários do perfil dos participantes dos testes das ferramentas de autoria. ................................................................................................................................................ 155 Figura 5.9: Escala apresentada aos participantes dos testes de usabilidade. ....................................... 156 Figura 5.10 a 5.17: Respostas dos participantes sobre a criação......................................................... 158 Figura 5.18 a 5.27: Respostas dos participantes sobre o sistema. ....................................................... 161 Figura 5.28: nível de satisfação com o resultado final. ....................................................................... 163 Figura 6.1: Participante 01 clica no Conjunto de Atividades MultiModal Set. ................................... 166 Figura 6.2: Participante 01 interage com a Secção de Módulos. ........................................................ 166 Figura 6.3: Participante 01 interage com a Secção Conteúdos. .......................................................... 167 Figura 6.4: Participante 01 interage com a Secção de Conteúdos do módulo Find Location. ........... 167 Figura 6.5: Participante 02 interage com o botão switch de visualização. .......................................... 168 Figura 6.6: Participante 02 interage com o modo Canvas de uma experiência já existente no sistema. ............................................................................................................................................................ 169 Figura 6.7: Participante 02 interage com o modo Mapa de uma experiência já existente no sistema. 169 Figura 6.8: Participante 02 interage com a secção de Módulos. ......................................................... 170 Figura 6.9: Participante 02 cria uma atividade com o drag and drop. ................................................ 170 Figura 6.10: Participante 02 interage com a funcionalidade Horários. ............................................... 171 Figura 6.11: Participante 02 interage com a secção de Módulos ........................................................ 171 Figura 6.12: Participante 02 interage o preview de uma atividade com módulo Find Location. ........ 172 Figura 6.13: Participante 03 clica no ícone do menu. ......................................................................... 173 Figura 6.14: Participante 03 interage com o modo Canvas. ............................................................... 173 Figura 6.15: Participante 03 interage com o modo Mapa. .................................................................. 174 Figura 6.16: Participante 03 pousa o cursor em cima da Conquista. .................................................. 174 Figura 6.17: Participante 03 interage com a secção Módulos. ............................................................ 175 Figura 6.18: Participante 03 interage com o painel de Publicação. .................................................... 175 Figura 6.19: Participante 03 interage com o painel de Pré-visualização. ........................................... 176 Figura 6.20: Participante 03 configura a data no painel de criação de uma nova experiência. ........... 176 Figura 6.21: Participante 03 seleciona o conjunto de atividades Exploratory Set. ............................. 177 Figura 6.22: Participante 03 interage com a secção de Requisitos. .................................................... 177 Figura 6.23: Participante 03 uso o menu contextual acidentalmente. ................................................. 178 Figura 6.24: Participante 03 fecha o menu de preview. ...................................................................... 178 Figura 6.25: Participante 03 clica o botão de publicar. ....................................................................... 179 20 Figura 6.26: Participante 04 interage com a secção de Módulos. ....................................................... 180 Figura 6.27: Participante 04 interage com o modo Canvas. ............................................................... 180 Figura 6.28: Participante 04 seleciona o Linear Set. ........................................................................... 181 Figura 6.29: Participante 04 seleciona o Cyclic Set. ........................................................................... 181 Figura 6.30: Participante 04 seleciona o menu contextual. ................................................................. 182 Figura 6.31: Participante 04 interage com a secção de Modulos. ....................................................... 182 Figura 6.32: Painel de tarefas para a nova proposta de interface da ferramenta de autoria para o projecto CHIC (2021). ...................................................................................................................................... 186 Figura 6.33: Melhoria nos botões dos modos de visualização da ferramenta de autoria para o projecto CHIC. Modo Mapa a esquerda e modo Canvas a direita (2021). ....................................................... 187 Figura 6.34: Janela de visualização alternativa da ferramenta de autoria para o projecto CHIC (2021). ............................................................................................................................................................ 187 Figura 6.35: Melhoria no modo Canvas da ferramenta de autoria para o projecto CHIC (2021). ..... 188 Figura 6.36: Melhoria na secção de Módulos da ferramenta de autoria para o projecto CHIC (2021). ............................................................................................................................................................ 189 Figura 6.37: Melhoria na secção de Conteúdo da ferramenta de autoria para o projecto CHIC (2021). ............................................................................................................................................................ 189 Figura 6.38: Melhoria na secção de Ligações da ferramenta de autoria para o projecto CHIC (2021). ............................................................................................................................................................ 190 Figura 6.39: Melhoria na funcionalidade Horário da ferramenta de autoria para o projecto CHIC (2021). ............................................................................................................................................................ 190 Figura 6.40: Itens desabilitados no Dashboard da ferramenta de autoria para o projecto CHIC (2021). ............................................................................................................................................................ 191 Figura 6.41: Melhoria no painel Publicar da ferramenta de autoria para o projecto CHIC (2021)..... 191 Figura 6.42: Melhoria na Conquista da ferramenta de autoria para o projecto CHIC (2021). ............ 192 Figura 6.43: Melhoria no painel modal Pré-Visualizar da ferramenta de autoria para o projecto CHIC (2021). ................................................................................................................................................. 192 Figura 6.44: Melhoria nos Conjuntos de Atividades da ferramenta de autoria para o projecto CHIC (2021). ................................................................................................................................................. 193 Figura 6.45: QR code para protótipo interactivo no Figma da ferramenta de autoria para o projecto CHIC (2021). ...................................................................................................................................... 193 Figure 7.1: Viagem no tempo em The Legend of Zelda: Ocarina of Time (1998). ........................... 196 Figura 7.2: Banco de dados de vídeo em Her Story (2015). ............................................................... 197 Figura A.1 a A.14: Respostas dos participantes sobre a criação. ........................................................ 212 Figura A.15 a A.21: Respostas dos participantes sobre a criação. ...................................................... 214 Figura A.22 a A.31: Respostas dos participantes sobre o sistema. ..................................................... 216 Figura A.32: Nível de satisfação dos participantes sobre o sistema. .................................................. 218 21 Figura C.1 a C.12: Respostas dos participantes sobre a interface ....................................................... 240 Figura D.1: Wireframe do Login......................................................................................................... 258 Figura D.2: Wireframe do Dashboard. ............................................................................................... 259 Figura D.3: Wireframe do Mapa. ........................................................................................................ 259 Figura D.4: Wireframe do Mapa com uma atividade. ........................................................................ 259 Figura D.5: Wireframe do Canvas com uma atividade. ...................................................................... 260 Figura D.6: Wireframe do Mapa com uma narrativa construída. ....................................................... 260 Figura D.7: Wireframe do Menu de configuração para a secção Módulos. ........................................ 261 Figura D.8: Wireframe do Menu de configuração para a secção Conteúdo. ...................................... 261 Figura D.9: Wireframe do Menu de configuração para a secção Configurar. .................................... 262 Figura D.10: Wireframe do Painel de Tarefas. ................................................................................... 262 Figura D.11: Wireframe do Painel de Tarefas para a secção ID. ........................................................ 263 Figura D.12: Wireframe do Painel de Tarefas para a secção Módulos. .............................................. 263 Figura D.13: Wireframe do Painel de Tarefas para a secção Conteúdo. ............................................ 264 Figura D.14: Wireframe do Painel de Tarefas para a secção Ligações............................................... 264 Figura D.15: Wireframe do Painel de Tarefas para a secção Requisitos. ........................................... 265 Figura D.16: Wireframe do painel Publicar. ....................................................................................... 265 Figura D.17: Design da interface do Login. ........................................................................................ 266 Figura D.18: Design da interface do Dashbaord. ............................................................................... 266 Figura D.19: Design da interface do Perfil. ........................................................................................ 267 Figura D.20: Design da interface do Mapa. ........................................................................................ 267 Figura D.21: Design da interface do Canvas. ..................................................................................... 268 Figura D.22: Design da interface do Mapa com uma narrativa construída. ........................................ 268 Figura D.23: Design da interface do Canvas com uma narrativa construída. ..................................... 269 Figura D.24: Design da interface da Conquista. ................................................................................. 269 Figura D.25: Design da interface do Painel de Tarefas. ..................................................................... 270 Figura D.26: Design da interface do Painel de Tarefas para a secção ID. .......................................... 270 Figura D.27: Design da interface do Painel de Tarefas para a secção Módulos. ................................ 271 Figura D.28: Design da interface do Painel de Tarefas para a secção Conteúdo. ............................... 271 Figura D.29: Design da interface do Painel de Tarefas para a secção Ligações. ................................ 272 Figura D.30: Design da interface do Painel de Tarefas para a secção Requisitos. ............................. 272 Figura D.31: Design da interface dos painéis de Pre-visualização de uma actividade. ...................... 273 Figura D.32: Design da interface do panel Publish............................................................................. 273 Figura D.33: Ícones para diferentes estados de uma atividade. .......................................................... 273 Figura D.34: Ícones para os Módulos. ................................................................................................ 273 Figura D.35: Melhoria para o Dashboard. .......................................................................................... 274 Figura D.36: Melhoria para o Mapa. ................................................................................................... 274 22 Figura D.37: Melhoria para o Canvas. ................................................................................................ 275 Figura D.38: Melhoria do Painel de Tarefas. ...................................................................................... 275 Figura D.39: Melhoria do Painel de Tarefas da atividade. ................................................................. 276 Figura D.40: Melhoria do Painel de Tarefas para a secção ID. .......................................................... 276 Figura D.41: Melhoria do Painel de Tarefas para a secção Mósulos. ................................................. 277 Figura D.42: Melhoria do Painel de Tarefas para a secção Conteúdo. ............................................... 277 Figura D.43: Melhoria do Painel de Tarefas para a secção Ligações. ................................................ 278 Figura D.44: Melhoria do Painel de Tarefas para a secção Requisitos. .............................................. 278 Figura D.45: Melhoria do painel de Pré-visualização. ........................................................................ 279 Figura D.46: Melhoria do painel Publicar. ......................................................................................... 279 23 Lista de Tabelas Tabela 2.1. Sumário das ferramentas de autoria ................................................................................... 56 Tabela 2.2: Trecho retirado ipsis verbis da Tabela 3. Princípios de design da Interação (Sousa 2017, 73-74). ................................................................................................................................................... 76 Tabela 2.3: Trecho retirado ipsis verbis da Tabela 2. Princípios de design da Arquitetura da Informações (Sousa 2017, 70-71). ............................................................................................................................. 80 Tabela 2.4. Trecho retirado ipsis verbis da Tabela 5. Princípios de design da Experiência de Utilização (Sousa 2017, 81-83) .............................................................................................................................. 84 Tabela 2.5: Levantamento dos principais padrões de Design. .............................................................. 88 Tabela 2.6: Levantamento dos padrões para Estratégias de Interação. ............................................... 100 Tabela 2.7: Levantamento de padrões para Estrutura de Interface. .................................................... 102 Tabela 2.8: Tipos de estrutura narrativa possíveis nos sistemas ......................................................... 104 Tabela 2.9: Levantamentos das estruturas de narrativas nos sistemas. ............................................... 106 Tabela 2.10: Levantamento dos tipos de participação nos sistemas. ................................................. 108 Tabela 2.11: Levantamentos das estruturas de narrativas nos sistemas. ............................................. 110 Tabela 2.12: Levantamento dos níveis de agência nos sistemas. ........................................................ 112 Tabela 2.13: Levantamento das possibilidades de agência nos sistemas. ........................................... 114 Tabela 2.14: Levantamento das travessias nos sistemas. .................................................................... 115 Tabela 2.15: Levantamento das travessias nos sistemas. .................................................................... 117 Tabela 3.1: Persona Primária para Ferramenta de Autoria. ................................................................ 123 Tabela 3.2: Travessias nos Cenários. .................................................................................................. 126 Tabela 5.1: Resultado do inquérito SUS. ............................................................................................ 162 Tabela 5.2: Impressões e Opiniões gerais acerca da ferramenta. ........................................................ 163 Tabela 6.1: Pontos de melhoria da Ferramenta de Autoria. ................................................................ 184 Tabela 6.2: Novos recursos para a Ferramenta de Autoria. ................................................................ 185 Tabela 7.1: Novas Travessias nos Cenários ........................................................................................ 197 Tabela A.1 - Persona Aplicação Mobile ............................................................................................. 206 Tabela A.2 - Cenários para a Persona Aplicação Mobile .................................................................... 207 Tabela A.3: Resultado do inquérito SUS ............................................................................................ 217 Tabela A.4: Impressões e Opiniões gerais acerca da aplicação. ......................................................... 218 Tabela B.1: Tarefas do Cenário 01 da Ferramenta de autoria. ............................................................ 223 Tabela B.2: Tarefas do Cenário 02 da Ferramenta de Autoria. .......................................................... 224 Tabela B.4: Tarefas do Cenário 01 da Aplicação Mobile. .................................................................. 231 Tabela B.5: Tarefas do Cenário 02 da Aplicação Mobile. .................................................................. 232 Tabela B.6: Tarefas do Cenário 03 da Aplicação Mobile. .................................................................. 233 24 Tabela B.7: Tarefas do Cenário 04 da Aplicação Mobile. .................................................................. 234 Tabela C.1: Resultados Participante 01 para o cenário de testes 01 da ferramenta de autoria. .......... 241 Tabela C.2: Resultados Participante 01 para o cenário de testes 02 da ferramenta de autoria. .......... 242 Tabela C.3: Transcrições dos Teste da Participante 01....................................................................... 243 Tabela C.4: Resultados Participante 02 para o cenário de testes 01 da ferramenta de autoria. .......... 245 Tabela C.5: Resultados Participante 02 para o cenário de testes 02 da ferramenta de autoria. .......... 246 Tabela C.6: Transcrições dos Teste do Participante 02 ...................................................................... 247 Tabela C.7: Resultados Participante 03 para o cenário de testes 01 da ferramenta de autoria. .......... 250 Tabela C.8: Resultados Participante 03 para o cenário de testes 02 da ferramenta de autoria. .......... 251 Tabela C.9: Transcrições dos testes da Participante 03 ...................................................................... 252 Tabela C.10: Resultados Participante 04 para o cenário de testes 01 da ferramenta de autoria. ........ 255 Tabela C.11: Resultados Participante 04 para o cenário de testes 02 da ferramenta de autoria. ........ 256 Tabela C.12: Transcrições dos testes da Participante 04 .................................................................... 257 25 Página intencionalmente em branco. 32 1. Ler Narrativas Interativas Ao vivenciar uma experiência interativa, um interator atravessa os acontecimentos de forma particular, influenciado por fatores como a narrativa, o storytelling, o sistema computacional, os fatores externos, entre outros. Este capítulo foca-se nos conceitos de narrativa e interatividade que compõem a definição da narrativa interativa. 1.1 Definições de Narrativa Interativa Numa experiência interativa, o interator participa na jornada a explorar o contexto, desdobrando os eventos até o fim. Em cada evento o interator age, e em consequência, o sistema responde, o que é capaz de gerar um novo evento para o interator e assim sucessivamente. Para entendermos o conceito de interatividade, é preciso compreender como a ação do utilizador influencia o sistema. Num videojogo, podemos observar uma ação do utilizador influenciar os eventos de uma narrativa. No entanto, há também ações que não alteram de forma percetível o jogo. Ao entendermos os princípios que constroem a interatividade, podemos entender os seus diferentes potenciais em alterar a experiência do interator. Chris Crawford (2013) define interatividade como um processo cíclico entre dois ou mais agentes ativos (neste estudo, entendidos como atores), nos quais cada agente ouve, pensa e fala alternadamente, uma conversa de todos os tipos. Crawford utiliza os termos ouvir, pensar e falar de maneira metafórica ao referir-se ao computador, (segundo o autor, os termos mais corretos seriam input, processar input e output) pois a sua definição de interatividade centra-se no conceito de conversa. A qualidade em geral desta conversa reside na qualidade de cada etapa, ouvir, pensar e falar, e a forma como essas três qualidades se combinam. Uma conversa em que um dos atores não consegue falar com clareza ou fala, mas não é ouvido, há uma falha na conversa. Da mesma forma, quando quem escuta a fala não compreende o que é dito, não se estabelece uma interação. Se uma das etapas da conversa falha, a conversa não existe independentemente da qualidade das outras duas etapas e, por conseguinte, não há interação entre os atores. Para Crawford, uma boa interatividade, ou conversa, depende do produto da qualidade individual de cada etapa e das suas combinações. A qualidade geral da interatividade (humano com humano ou humano com computador) depende do produto, ao invés da soma, das qualidades individuais das três etapas. Devemos ter boa escuta, bom pensamento e bom discurso para ter uma boa interação. 2 (Crawford 2013, 29) 2 Tradução do autor (T.A.): “The overall quality of interactivity (human-with-human or human-with-computer) depends on the product, rather than the sum, of the individual qualities of the three steps. You must have good listening and good thinking and good speaking to have good interaction.” (Crawford 2013, 29) 33 Crawford complementa a sua definição de interatividade com a atenção a questão da reação. Se uma pessoa assiste a um filme, por exemplo, e o seu coração acelera e os seus dedos tremem com a empolgação da cena, isto não caracteriza uma interação. O filme não ouve o espetador falar ou o que está a pensar, há apenas a fala. A reação é uma ação, mas não pode ser entendida como interação. O relacionamento entre a audiência e o filme é unilateral. A interação requer que uma ação seja entre os actores, caso contrário, é apenas uma reação e não estabelece uma conversa. Adams (2012) define interatividade como a capacidade do interator de interagir com qualquer software, independentemente de haver alguma história envolvida, e isso não implica, necessariamente, poder de decisão. Com o exemplo de Sonic: The Hedgehog (1991), Adams esclarece como um videojogo pode oferecer muita interatividade, mas pouca interferência no enredo. Independente do caminho escolhido pelo jogador para Sonic, a conclusão do jogo permanece a mesma. Assim, independentemente da ação do jogador no momento presente, esta não tem efeito sobre os eventos futuros do enredo. Com esta definição, Adams esclarece que a interação do interator com o sistema não está subjugada à ideia de causa e efeito com os eventos da experiência. Dependendo dos parâmetros e limites possíveis de um sistema, o interator é capaz de interagir livremente sem influenciar o comportamento do sistema ou os eventos futuros. Embora existam diferentes definições para narrativa, para construirmos a definição adequada para este estudo, é preciso entender a narrativa de uma perspetiva estrutural. Para este fim, Ryan (2002) define a natureza da narrativa como uma representação mental, um modo de pensar, não limitado ao storytelling oral ou escrito, mas que pode ser evocada por muitos meios de comunicação, tipos ou sinais. Como representação mental, a narrativa consiste num mundo (contexto), povoado por indivíduos (personagens), que participam em ações e acontecimentos (eventos, enredo), pelos quais passam por mudanças (dimensão temporal). 3 (Ryan 2002, 583) Com esta perspetiva, podemos entender a narrativa como uma estrutura que consiste num contexto (setting), povoado por atores (characters), os quais participam em eventos (events) que conectam entre si numa determinada ordem (temporal dimension). Estes eventos podem ser entendidos para além do conceito de enredo, podem constituir tanto como parte do que foi previsto pelo autor, quanto pelo que não era expectado. A soma, a ordem e a forma que estes eventos surgem para o interator é o que compõe a narrativa da experiência. Este, alinha-se com a definição de narrativa de Cardoso (2016), sendo a sequência de eventos gerados por comportamentos resultantes de procedimentos internos do sistema e das ações do interator, expressos em tempo de execução durante uma experiência. 3 T.A.: “As a mental representation, narrative consists of a world (setting), populated by individuals (characters), who participate in actions and happenings (events, plot), through which they undergo change (temporal dimension).” (Ryan 2002, 583) 34 A sequência de eventos gerados por esses comportamentos é o que constitui a narrativa. Tenha em mente que não estamos necessariamente a falar sobre o enredo do jogo – embora os mecanismos que geram essa narrativa possam influenciar e até conseguir gerá-la –, mas sobre todos os eventos resultantes de procedimentos internos do sistema de jogo e de as interações do jogador com ele são expressas em tempo de execução durante um jogo. 4 (Cardoso 2016, 88) Embora exista uma correlação entre o storytelling e a narrativa, o primeiro abrange o conteúdo, enredo, personagens e outros fatores que não constituem o foco deste estudo. A narrativa, por outro lado, entende-se como a sequência e a conexão de eventos percebidos pelo interator, considerando as ações e os intervenientes das ações como forças motrizes. Em conclusão, este estudo admite a definição de narrativa interativa como a sequência e a conexão de eventos, gerados pela interação com o sistema, da forma como são percebidos pelo interator. 1.2 Tipos de estruturas narrativas A estrutura de uma narrativa interativa pode assumir diferentes formas, ramificações e conexões que permitem ao interator alternar entre os eventos da experiência. A arquitetura das ligações da narrativa é um dos grandes potenciais que uma narrativa interativa pode ter. Para entender como uma narrativa pode ser estruturada, analisámos estudos de diferentes autores. De forma a manter a coerência numa narrativa interativa, a autora Marie-Laure Ryan esclarecenos que “o designer do sistema deve ser capaz de prever as possíveis ações do interator e para alinhálas em direção ao efeito desejado. O interator deve progredir sob a impressão de que as suas ações determinam o curso do enredo, quando de facto, as suas escolhas são configuradas pelo sistema em função do efeito a ser alcançado” 5 (Ryan 2011, 246). Neste enquadramento, Ryan (2001) apresenta-nos nove tipos de estruturas narrativas: 1. The Complete Graph representa a estrutura onde cada evento está conectado a todos os eventos, permitindo liberdade total de navegação para o interator. Esta estrutura oferece alta liberdade, torna-se, no entanto, quase impossível garantir a coerência da história. 4 T.A.: “The sequence of events generated by these behaviours is what constitutes narrative. Bear in mind that we are not necessarily talking about the storyline of the game – although the mechanisms that generate this narrative may influence and even be able to generate it –, but about all the events that result from internal procedures of the game system and from the player’s interactions with it that are expressed in runtime during a game.” (Cardoso 2016, 88) 5 T.A.: “The system designer must be able to foresee the possible actions of the user and to streamline them toward the desired effect. The user should progress under the impression that his actions determine the course of the plot, when in fact his choices are set up by the system as a function of the effect to be reached.” (Ryan 2011, 246) 35 2. The Network representa uma estrutura onde a navegação do interator não é livre, nem limitada por um único percurso. A rede não pode controlar a duração ou o curso da navegação do interator. Nesta estrutura a configuração de narrativa pode ser garantida apenas em o nível local, de um evento para o próximo ou dentro de uma sequência de eventos com conexões únicas. 3. The Tree representa a estrutura onde quando é feita uma escolha, não há retorno ao ponto de decisão e existe apenas uma forma de chegar a um determinado evento. 4. The Vector with Side Branches descreve uma narrativa que segue uma determinada ordem de eventos. Contudo, a estrutura de ligações permite pequenos desvios. A cada evento da narrativa o interator pode aceder a subeventos e voltar a ordem principal. 5. The Maze é o tipo de estrutura em que o interator parte de um ponto inicial e pode chegar ao ponto final de diferentes formas. A estrutura pode permitir ao interator navegar entre os eventos em círculos, retroceder o percurso e alguns eventos podem representar um fim de linha não desejado. 6. The Directed Network representa a estrutura com uma sequência de eventos com as ramificações sobrepostas representando as escolhas oferecidas ao interator. Este tipo de estrutura oferece um itinerário, mas o interator tem a liberdade para conectar os vários estágios da jornada. Assemelha-se a Estrutura de Árvore, mas apresenta ligações intermedias. 7. The Hidden Story é uma estrutura com a narrativa em dois níveis: a primeira é uma ordem em linha dos eventos, e a segunda é uma rede de eventos onde o interator navega. Ao navegar pela rede, as escolhas suas escolhas podem levar aos eventos da linha. Com a evolução da narrativa em rede, o interator desvenda a ordem correta da narrativa em linha. 8. The Braided Plot é o tipo de narrativa que contém duas dimensões, temporal e espacial. Os diferentes eventos podem ocorrer no mesmo espaço e tempo. Cada caminho que o interator escolhe navegar representa um ponto de vista particular sobre o evento dentro da narrativa, permitindo acompanhar um ponto da narrativa sob influência da dimensão temporal ou da dimensão espacial. Como, por exemplo: ouvir o mesmo acontecimento contado por duas pessoas diferentes. 9. The Action Space, Epic Wandering, and Story-World representa o tipo de estrutura focada no nível macro. Nesta estrutura o interator navega num determinado evento à sua escolha. No entanto, ao escolher o evento, o sistema o transporta para outra estrutura de narrativa de nível micro. Depois de navegar nos eventos do nível micro, o interator volta ao nível macro para escolher um novo evento e assim seguir com esta dinâmica de níveis de narrativa até o fim. 36 Figura 1.1: Tipos de Estruturas de Narrativas por Marie-Laurie Ryan (2001) Adams (2012) classifica as estruturas de narrativa, sobre a perspetiva da indústria de videojogos, de forma relevante ao conceito de narrativa deste estudo e a diferentes tipos de media. O autor usa uma terminologia própria para explicar as estruturas de narrativas existentes, entretanto, esta é intercambiável com a terminologia utilizada no nosso estudo. Adams nomeia como enredo (plot, no original) o que, neste estudo, nomeámos como narrativas. Entretanto, no contexto de estruturas narrativas, os dois termos têm a mesma função. Salientamos esta distinção, uma vez que o autor interpreta narrativa especificamente como aquilo que é narrado, para material de apresentação numa história interativa que não está no poder do interator mudar (Adams 2012, 24). A nossa definição de narrativa abrange o enredo, mas centra-se na sequência e a conexão de eventos da forma como são percebidos pelo interator. Os tipos de narrativa segundo Adams são: 1. The Linear Plots é uma estrutura que contém uma sequência imutável de eventos. Neste tipo de narrativa pode haver muitas interações e exigir determinadas ações do interator, no entanto existe, inevitavelmente, apenas um final. 2. The Branching Plots representada como um gráfico acíclico direcionado, onde cada vértice representa um evento decisivo e cada aresta pode representar um ou mais eventos da narrativa. 37 A narrativa inicia-se num evento pré-selecionado e navega através das arestas que se encontram entre os vértices. O interator pode variar a sequência de eventos a depender das escolhas feitas. O interator pode chegar a diferentes finais da narrativa, mas não altera a estrutura predefinida pelo sistema, navegando por escolhas preestabelecidas. 3. The Foldback Plot é similar a um enredo ramificado, porém todos os caminhos periodicamente levam ao mesmo evento. Eventos inevitáveis reduzem o poder de decisão do interator, causando a sensação de estar a participar numa grande variedade de eventos dos quais o interator é apenas uma parte. Figura 1.2: The Foldback Plot por Ernest W. Adams (2012) 4. The Main Plot with Subplots é o tipo de narrativa que representa a navegação do interator por uma narrativa principal. No entanto, qualquer um dos eventos podem levar a uma narrativa de nível menor, e depois de a finalizar, ou abandoná-la, o interator retoma a narrativa principal. Cada narrativa menor, ou subenredo, pode ter um tipo de estrutura própria e, enquanto o interator navega por esta narrativa menor, a narrativa principal fica em espera. 5. The Procedurally Generated (Emergent) Plots é um tipo de estrutura sem um gráfico predeterminado pelo autor. Esta narrativa surge da interação do interator com os autores no sistema. A sequência de eventos desta estrutura que o interator experiência não pode ser completamente prevista e depende da natureza da simulação do sistema. É entendido que tudo o que o jogador faz pode influenciar a narrativa como um todo. 6. The Hybrid System é o tipo de estrutura onde há duas bases de dados num mesmo sistema: uma base de dados com scripts de narrativas potenciais sem actores e outra com simulações de actores. O sistema une as duas bases de dados e desenvolve eventos para o interator conforme as simulações de actores dentro do script de narrativa. Quando o sistema executa um script de narrativa, utiliza um ou mais actores da base de dados como parâmetros para os eventos da 38 narrativa. O interator exerce a sua agência ao interagir com estes actores dentro do script de narrativa executada. Se o interator refizer a experiência, o sistema provavelmente executará um novo script com outros actores e com diferentes eventos. Podemos observar que cada autor utiliza a sua própria classificação para as estruturas narrativas, entretanto, em alguns casos, utilizam diferentes nomes para a mesma estrutura. Temos como exemplo a estrutura Tree de Ryan e a estrutura Branching Plot de Adams, em que ambas descrevem uma estrutura onde cada evento conduz a escolhas preestabelecidas que ramificam a narrativa. Os tipos de estruturas narrativas consideram a liberdade que se deseja dar ao interator para fazer escolhas na narrativa. A estrutura Linear Plot de Adams não dá escolha ao interator sobre a narrativa, seguindo apenas um único caminho do início ao fim. Em contrapartida, há a estrutura Maze de Ryan que permite ao interator enredar por diversos caminhos, e retomar a algum evento passado e diferentes opções para concluir a narrativa. Há estruturas que permitem transmitir a sensação de escolha ao interator sempre dentro de parâmetros preestabelecidos. Estruturas como a Directed Network ou Foldback Plot permitem ao interator muitas escolhas, no entanto, todas as escolhas possíveis convergem para um único evento, independentemente da vontade do interator. Há também estruturas que permitem que um sistema responda às ações do interator com o surgimento de eventos não previstos através desta interação. A estrutura Procedurally Generated (Emergent) Plots exemplifica este caso, onde cada evento é gerado apenas no momento em que o interator interage com a narrativa, não sendo, este, previsto anteriormente. Quando o interator vivencia a experiência interactiva, é possível ocorrer uma discordância entre o que é suposto o interator fazer e o que este deseja, entre ter que realizar alguma ação específica e poder explorar o sistema livremente. Nesta dissonância reside a diferença entre dois tipos de narrativa, a narrativa hardcoded e a narrativa emergente. Cardoso (2016) esclarece estes dois tipos de narrativas possíveis. Primeiramente, a narrativa hardcoded, uma narrativa fixa e prescrita, fácil de ser reconhecida e com o desenrolar dos eventos a acontecer de forma calculada. Em seguida, a narrativa emergente, uma narrativa fluida, dinâmica e sem uma estrutura previamente definida. O autor descreve as características dessas narrativas no contexto dos videojogos. Um exemplo claro da coexistência destas duas narrativas são os videojogos classificados como “mundo aberto”. Estes são conhecidos por apresentarem uma história principal prescrita permitindo, no entanto, ao interator explorar o mundo virtual livremente e evitar os eventos da história principal. Ao explorar o mundo livremente a história principal não progride, permanece em espera. Entretanto, mesmo quando a história principal está em espera, outra estrutura narrativa permanece ativa (Cardoso 2016, 264). 39 Os videojogos são artefatos que vivem para desenvolver dois tipos de narrativa: uma que é fixa, reconhecível e que faz sentido, cujo arco dramático é cuidadosamente calculado — a narrativa hardcoded — e a que é fluida, dinâmica e desprovida de uma estrutura definida anteriormente, às vezes estranha e até abstrata — a narrativa emergente. Tradicionalmente, a primeira consiste no enredo que pode ser vivenciado através de interlúdios cinematográficos, cut scenes, diálogos etc., e a última é dinâmica e sem guião. 6 (Cardoso 2016, 264) Os videojogos da série Grand Theft Auto 7 são exemplos de jogos do género mundo aberto em que podemos observar estes dois tipos de narrativas. Qualquer um dos jogos desta série apresenta uma narrativa hardcoded, uma história principal fixa e prescrita. Entre um evento e outro da história principal, o interator tem a possibilidade de explorar o mundo virtual do jogo livremente. Essa interação, fluida e espontânea, gera eventos não prescritos, permitindo ao interator experienciar a narrativa emergente e testar os limites do mundo virtual. Segunto Crawford (2013) as narrativas emergentes são histórias totalmente conduzidas pelo jogador. O autor define este tipo de narrativa, onde o interator pode interagir de forma fluida e espontânea, como a narrativa onde o interator pode explorar um ambiente que julga ser interessante e realizar ações que julga serem interessantes, mas não há uma história convencional. Desta forma, os eventos experienciados são gerados pelo sistema em resposta às ações do interator. O jogador é livre para passear por um ambiente interessante e fazer coisas interessantes, mas não há nenhuma história – pelo menos, nenhuma no sentido convencional. Certamente não há indícios de uma história criada por um autor. 8 (Crawford 2013, 156) Cardoso (2016) complementa mencionando que, apesar das diferenças entre os dois tipos de narrativa, elas não são antagônicas, mas complementares. A proporção entre os dois tipos de narrativas é que determina o quanto uma narrativa interativa é estática e o quanto ela é volátil e opera por ocorrências procedurais (Cardoso 2016, 264). Com isto em mente, um autor de uma narrativa interativa pode desenvolver uma estrutura que contenha os dois tipos de narrativa a coexistir de forma harmoniosa. Este equilíbrio permite ao interator ter momentos onde acompanha uma história que está a ser contada, como espectador, e outros momentos onde a sua vontade é respeitada, como um participante ativo permitindo ao interator vivenciar uma história e personalizar a própria experiência numa única narrativa interativa. 6 T.A.: “Video games are artefacts that live by developing two kinds of narrative: one that is fixed, recognisable, that makes sense, whose dramatic arc is carefully calculated – the hardcoded narrative –, and one that is fluid, dynamic, devoid of a previously defined structure, strange and even abstract sometimes – the emergent narrative. Traditionally, the first consists in the storyline that can be experienced through the cinematic interludes, cut scenes, dialogues, etc., and the latter is dynamic and unscripted” (Cardoso 2016, 264) 7 Série Grand Theft Auto: https://pt.wikipedia.org/wiki/Grand_Theft_Auto (comsultado em 12 de junho de 2021) 8 T.A.: “The player is free to wander around an interesting environment and do interesting things, but is no story at all - at least, none in the conventional sense. Certainly there is no inkling of a story designed by an author.” (Crawford 2013, 156) 40 1.3 Níveis de participação do interator Cada interação do interator com o sistema pode ter um diferente impacto na narrativa. Este impacto varia conforme o nível de participação permitido ao interator num determinado evento da narrativa. Desde uma interação simples com a interface do sistema até à escolha de uma opção que altere, de forma crítica, a estrutura da narrativa. Os níveis de participação do interator numa narrativa são determinados pelos limites do sistema que a suporta e como este responde às ações do interator. Ryan (2005) analisa a participação do interator classificando-a conforme a relação entre dois eixos de interação ou dicotomias. O primeiro eixo é o interno/ externo: o modo interno refere-se ao interator como membro de um ambiente, através de um avatar ou visão na primeira pessoa; e o modo externo é a perspetiva externa ao ambiente como uma perspetiva omnipresente que controla o ambiente. O segundo eixo é o ontológico/ exploratório: o modo ontológico é aquele onde as ações do interator provocam efeitos na narrativa; e o modo exploratório é aquele onde o interator é livre para navegar através da base de dados, mas não pode alterar a narrativa. Ao aprofundar a participação do interator, Ryan (2005) analisa as interceções existentes entre os dois eixos e as relações que estes formam, observando quatro grupos de interatividade, classificandoas em níveis. Essas quatro categorias estão relacionadas com diferentes camadas da cebola interativa. Nas camadas externas, a interatividade tende a ser exploratória, enquanto que na camada interna deve ser ontológica. Nas camadas externas, a interatividade tende a ser externa, enquanto é interna na camada interna. O núcleo da cebola é consequentemente ocupado pelo modo ontológico interno de participação e as camadas externas pela participação exploratória externa. As categorias mistas de interno-exploratório e ontológico-externo são mais difíceis de categorizar em relação às camadas da cebola; mas encontraremos exploratório interno numa camada intermediária e ontológico externo o mais próximo possível do núcleo. 9 (Ryan 2005) Segundo este modelo de Ryan, os quatro níveis de interatividade do interator são: 1. Nível 1 – Interatividade Periférica: neste nível a narrativa emoldurada dentro de uma interface e a interação do interator não altera a narrativa nem a ordem dos eventos que a compõem como é exemplo os controlos de reprodução de vídeo do Youtube. O interator pode clica no play, na 9 T.A.: “These four categories relate to different layers of the interactive onion. On the outer layers, interactivity tends to be exploratory, while it must be ontological on the inner layer. And on the outer layers, interactivity tends to be external, while it is internal on the inner layer. The core of the onion is consequently occupied by the internalontological mode of participation and the outer layers by external-exploratory participation. The mixed categories of internal-exploratory and ontological-external are more difficult to categorize with respect to the layers of the onion; but we will find internal exploratory on a middle layer and external-ontological as close to the core as we will get.” (Ryan 2005) 41 pausa e até em modificar a velocidade de reprodução. Entretanto, não é possível alterar a ordem como a narrativa do vídeo é contada. 2. Nível 2 – Interatividade a Afetar o Discurso Narrativo e a Apresentação da História: Neste nível os eventos da narrativa são pré-determinados. No entanto, através da utilização de mecanismos interativos do sistema, o interator pode alterar a forma como estes são apresentados. Este nível de narrativa descreve estruturas como a Network ou a Maze onde o interator pode atravessar um mesmo evento diversas vezes e por diversos caminhos, como se pode verificar em Her Story (2015), onde o interator tem acesso a uma galeria de vídeos e deve estabelecer uma coerência entre os artefactos. Na tentativa de encontrar uma unidade, o interator pode ter que visualizar os mesmos vídeos diversas vezes em ordens diferentes. 3. Nível 3 – Interatividade a Criar Variações numa História Parcialmente Pré-Definida: Neste nível o interator é um membro do ambiente da narrativa, e o sistema permite alguma liberdade de ação, mas os impactos das escolhas nos eventos da narrativa servem para progredir uma narrativa fixa, o sistema permanece ao seguir uma trajetória. Neste nível de participação o interator possui uma representação, um avatar, no mundo virtual do sistema. O interator não realiza, apenas, ações abstratas, que representam o ajuste físico do avatar com o mundo ao seu redor. Counter-Strike (2000) e The Witcher 3: Wild Hunt (2015) são exemplos deste nível de participação. O interator pode interagir com o espaço físico virtual, entretanto a narrativa hardcoded continua a influenciar a trajetória da experiência. 4. Nível 4 – Histórias Geradas em Tempo Real: Neste nível os eventos da narrativa não são predeterminados, mas gerados dinamicamente a partir de dados fornecidos em parte pelo sistema e outra parte pelo interator. Cada nova experiência deve resultar numa narrativa diferente, ou seja, o sistema deve ser possível de se reproduzir. Este nível de participação ainda não possui um exemplo aplicado. Integrar a entrada do usuário no processo de geração de uma narrativa em tempo real eleva a dificuldade de implementação. Um exemplo ficcional deste tipo de narrativa é Holodeck, uma instalação de realidade virtual existente na série Star Trek. No Holodeck, um sistema executa um mundo virtual tridimensional. O interator torna-se um personagem numa história digital. O conteúdo desta história é gerado ao vivo, por meio da interação entre o interator humano e as personagens virtuais geradas por computador. Das camadas mais periféricas até o cerne da narrativa, Ryan (2005) mostra como determinar o nível de participação que o interator pode ter na experiência. Ao entender a narrativa como os eventos que a formam e as estruturas que podem assumir, os níveis de participação podem determinar o impacto das ações do interator em cada um destes eventos. Isto leva-nos ao conceito de agência, em que o interator percebe o efeito que as suas ações têm no sistema com que interage. 48 da natureza de constante mudança destas redes que os comportamentos emergem. Estes comportamentos são testemunhados pelo interator principalmente através das regras do sistema em movimento. Quando em número suficiente, pode ser expresso um comportamento coletivo de grande complexidade. O comportamento emerge a partir de muitas redes de atores que constituem o sistema geral, com cada ator tendo um potencial de efeito significativo sobre outro ator a ele conectado, e consequentemente, a afetar o desenrolar da narrativa. O comportamento emerge das muitas redes de atores que constituem o sistema geral (sistema de jogador e jogo, neste caso), com cada ator tendo um efeito potencial significativo nos outros que estão conectados a ele, afetando consequentemente o desenrolar da narrativa. 20 (Cardoso 2016, 88) Em consequência e como já citado, podemos compreender que a sequência de eventos geradas pelos comportamentos dos atores é o que constitui a narrativa. Todos os eventos são resultados de procedimentos internos do sistema e das interações do interator com o sistema que são expressas em tempo real durante a experiência. Este tipo de narrativa é o que entendemos como a experiência do interator. A sequência de eventos é então percebida e assimilada pelo interator. Ao focarmos os nos procedimentos da experiência, nas ações originadas pelo interator e pelo sistema, e nos resultados que emergem desta relação, entendemos a narrativa interativa como uma experiência dinâmica, fluída e com uma travessia ergódica. Podemos perceber assim, que uma narrativa interativa possui diversas formas de ser experienciada o que implica diferentes formas de a atravessar, com resultados diferentes. Com isto em mente, é preciso entendermos os diferentes tipos de travessias ergódicas que podem ocorrer numa narrativa interativa. 1.5.3 Tipos de Travessia Ergódica Dos eventos que emergem do relacionamento entre os atores, surgem diversas formas de atravessar a narrativa. Estas variedades de travessias das narrativas podem ser classificadas em diferentes tipos. Cardoso (2016) identificou uma classificação em seis tipos de travessias ergódicas. Branching é o tipo de travessia que ocorre quando o interator precisa de escolher entre duas opções mutuamente exclusivas. É o tipo mais simples de travessia e, como descrito por Aarseth (1997), o interator é constantemente lembrado das escolhas que não realizou. De acordo com Cardoso (2016, 266) Super Mario Bros. (1985) é um exemplo deste tipo de travessia. No primeiro nível, o jogador segue para a direita em direção ao fim da fase sem possibilidade de retorno. Ao deparar-se com alguns canos, o interator tem a opção de explorar um cenário subterrâneo. Ao regressar, o interator aparece à 20 T.A.: “Behaviour emerges from the many networks of actors that constitute the overall system (player and game system, in this case), with each actor having a potential meaningful effect on the others that are connected to it consequently affecting how narrative unfolds.” (Cardoso 2016, 88) 49 frente do ponto de entrada e sem a possibilidade de voltar. Perde-se a oportunidade de explorar parte do cenário da superfície. Neste momento, o jogo evidencia que cada caminho escolhido irá excluir as outras possibilidades. Figura 1.3: Mapa completo do nível 1:1 de Super Mario Bros. (1985). Fonte: https://nesmaps.com/maps/SuperMarioBrothers/SuperMarioBrosWorld1-1Map.html, em 29/03/2020 Bending é o tipo de travessia que permite o interator prolongar a sua experiência ao aceder a eventos opcionais acerca da narrativa. O interator tem acesso a eventos opcionais, não mutuamente excludentes, sendo capaz de aprofundar o seu conhecimento acerca da narrativa ou explorar narrativas paralelas. A travessia do tipo Bending pode prolongar a experiência sem aparentemente progredir na narrativa principal. É possível observar este tipo de travessias em jogos onde o jogador se pode envolver em diversas atividades sem progredir na narrativa principal, como no jogo de cartas Gwent 21 em The Witcher 3: Wild Hunt (2015) ou o minijogo Gnat Attack 22 em Mario Paint (1992). Figura 1.4: Imagem do jogo de cartas Gwent em The Witcher 3: Wild Hunt (2015). Fonte: https://witcher.fandom.com/wiki/Gwent, em 23/05/2020 21 Gwent é um minijogo de cartas colecionáveis dentro de The Witcher 3: Wild Hunt (2015). O jogo é sobre o confronto de dois exércitos travado num campo de batalha onde os jogadores são os líderes e as cartas o seu exército. Com quatro fações diferentes, cada uma com o seu estilo de combate próprio. 22 Gnat Attack é um minijogo dentro do videojogo Mario Paint (1992), onde o jogador deve golpear moscas usando um mata-moscas. 50 Modulating é o tipo de travessia em que o sistema permite ao interator influenciar a rede de relacionamentos entre os actores do sistema. Este tipo de travessia consiste na construção de relacionamentos e em gerir a disposição entre actores no sistema. Podemos dizer que através das suas ações, o jogador pode influenciar diretamente ou indiretamente o comportamento de outros actores. Podemos observar este tipo de travessia em The Walking Dead (2012). Cada diálogo apresenta diversas escolhas ao interator e cada escolha modula a relação do interator com os outros personagens. Dragon Age: Origins (2009) aplica este tipo de travessia com um sistema de aprovação, numa escala de -100 a 100, que regula a relação do interator com os outros personagens. Pode-se observar a influência destas escolhas na afinidade gerada entre alguns personagens e os conflitos que se verificam noutros, como consequência da ação do interator no tecido social do jogo. Figura 1.5: Imagem de um diálogo no jogo The Walking Dead (2012). Fonte: https://thecatholicgeeks.com/2016/05/10/a-zombie-game-with-brains-the-walking-dead-season-1/. em 29/03/2020 Profiling é o tipo de travessia que permite reconhecer padrões nos dados e identificar ou representar um actor, ou elementos no sistema (Cardoso 2016, 277). A travessia de Profiling não se trata apenas de recolher dados sobre do modo de uso de um actor no sistema. Esta travessia ocorre através da recolha de dados e da contextualização dos mesmos. Combinam-se as escolhas feitas por um actor com as motivações que o levaram a realizar tal escolha. O Profiling interpreta dados para identificar padrões de comportamentos e conjuntos de ações para responder de acordo com estas informações. Dragon Age: Origins (2009) e Knights of Pen and Paper 2 (2015) fazem um uso deste 51 tipo de travessia no momento da criação do personagem ao incluir escolhas de contexto social e raça no jogo que irá influenciar diversos outros fatores da narrativa. Figure 1.6: Ecrã de criação da origem do personagem em Dragon Age Origins (2009). Fonte: http://jdgamingblog.blogspot.com/2014/10/the-past-and-times-of-yore-dragon-age.html. em 01/06/2020 Reprising ocorre quando o interator deve repetir passagens semelhantes da narrativa. Os Videojogos de aprendizagem ou onde a repetição permite ao interator otimizar seu desempenho são exemplos deste tipo de travessia. A repetição também pode ser uma forma do interator explorar o mundo da narrativa. Este tipo de travessia pode ser observado em jogos como Gran Turismo (1998) em que a repetição serve para melhorar o desempenho do jogador, ou em jogos como The Witcher 3: Wild Hunt (2015), em que após o término do jogo é permitido ao jogador reiniciar no modo Novo Jogo+ e é possível jogar pela segunda vez, mas conservar itens e power ups adquiridos da primeira vez. Figura 1.7: Novo Jogo + em The Witcher 3: The Wild Hunt (2015). Fonte: https://www.youtube.com/watch?v=k8unkWBA1u4, em 01/04/2020 52 Exploiting é um tipo de travessia não vinculado à parte intencional do sistema, mas sim à parte disfuncional. Quando um interator atravessa o sistema a explorar ocorrem manifestações de falhas específicas, bugs e glitches, podemos dizer que estão a atravessar por Exploiting. Estas falhas resultam em imprevistos que podem abrir caminho para algo novo e outras podem impedir o interator de progredir. Este tipo de travessia pode ser encontrado em Grand Theft Auto: San Andreas (2004) através do glitch conhecido como Blue Hell, onde o jogador pode usar falhas no modelo 3D da cidade criado pelos desenvolvedores para sair e flutuar por fora do modelo, atravessar a cidade e emergir onde desejar. Outro exemplo deste tipo de narrativa é o glitch MissingNo. em Pokémon Red/Blue (1996). Esta falha no jogo gera um evento com um “pokémon” inexistente na base de dados. O encontro com este glitch pode causar erros críticos nos jogos, mas também pode causar vantagens indevidas para o interator que consiga capturar esse "pokémon''. Figura 1.8: falha Blue Hell em Grand Theft Auto: San Andreas (2004). Fonte: https://gta.fandom.com/wiki/Blue_Hell, em 29/03/2020 Os estudos da Ryan (2011) acerca das estruturas de narrativas oferecem contributos às travessias ao observamos como o interator pode navegar nas estruturas propostas pela autora. Em específico, ressaltamos aqui as estruturas Brained Plot e Hidden Story (secção 1.2) que nos oferecem contributos para determinar outros dois tipos de travessias de narrativa interactivas. Os tipos de travessia apresentadas por Cardoso (2016) complementam a última parte da nossa definição das narrativas interativas. Entende-se por narrativa interativa a sequência e a conexão de eventos, gerados pela interação com o sistema, e da forma como são entendidos pelo interator. As conexões entre eventos formam as estruturas que detalham as ramificações e caminhos possíveis entre os mesmos (eventos). Cada evento de uma narrativa tem potencial para diferentes níveis de participação e capacidade de conceder ao interator a sensação de agência sobre a narrativa. Este esforço do interator com o sistema permite-o navegar a narrativa numa travessia ergódica. A travessia ergódica de uma narrativa interativa pode ocorrer de diversas formas. Estes conceitos unidos esclarecem-nos como percebemos e interpretamos uma narrativa interativa. Após este entendimento conceitual, seguimos para a compreensão da construção de uma narrativa interativa, como desenhar uma narrativa interativa, através de padrões de interação, ferramentas e sistemas. 53 2. Desenhar Narrativas Interativas 2.1 O que é o design de narrativas As narrativas vivenciadas pelo interator são uma sequência de eventos que se desdobram em resultados das ações do interator na estrutura do sistema. Esta sequência de eventos, embora dependente da ação, é parte de uma estrutura narrativa maior, criada intencionalmente por um autor. O autor de uma narrativa interativa opera o sistema para desenvolver os eventos e construir as narrativas experienciadas pelo interator. Ao desenvolver a narrativa interativa, o autor deve estabelecer a harmonia entre as ações possíveis no sistema, a interface e interação com o interator e o conteúdo de cada evento da narrativa. Este esforço requer pensamento criativo e estratégico para conceber a narrativa como um projecto ou design da narrativa interativa. No caso dos videojogos, um designer de narrativas deve integrar a história com o gameplay do jogo, isto é, o progresso do enredo deve ocorrer junto aos comandos do interator. Berger (2019) utiliza o contexto dos videojogos e apresenta uma definição para design de narrativa: É criar um caminho para a história, a ser revelada um pouco de cada vez, uma vez em que as condições forem atendidas, dentro ou entre os momentos de gameplay. 23 (Berger 2019, 11) O autor aprofunda a definição e explica o significado de cada parte da sua frase. Criar o caminho para a história é o “O Que” ou “Quais” do design de narrativas; é criar a trajetória da história e identificar os momentos onde narrativa está entrelaçada com o gameplay, quais os mecanismos que revelam a história, quais regras e critérios necessários para revelar a história. Ao dizer que a história deve ser revelada gradualmente, o autor enfatiza o “Quando”. O designer da narrativa deve possuir uma estrutura para a história como guia. Dividir os momentos da narrativa ao longo da experiência. Devem-se atribuir estes marcos da história com o gameplay. Deste modo a evolução da história é ditada pela evolução do gameplay. Atender às condições é o “Como”. Para se revelar uma parte da história o interator deve completar uma ação, tarefa, objetivo, coletar um item, entre outras. Isto estabelece uma troca entre interator e criador. A narrativa torna-se como uma recompensa no sentido em que o interator deve ativamente progredir no jogo para receber a próxima parte da história. Desta forma, a narrativa encontrase entrelaçada aos momentos onde o interator clica nos botões do comando, e não numa entidade separada. Isto refere-se ao facto da narrativa estar “dentro ou entre os momentos de gameplay” (Berger 23 T.A.: “It’s creating a pathway for the story, to be revealed one bit at a time, once conditions have been met, within or in between gameplay moments.” Berger (2019, 11) 54 2019, 11), o que o autor define como o “Onde”. Com isto em mente, o desafio do criador é distribuir a narrativa ao longo dos momentos de interação de modo a não prejudicar a experiência. Ao abordar o contexto de videojogos Ann Lemay, Jennifer Brandes Hepler, Tobias Heussner, Toiya Kristen Finley, em Game Narrative Toolbox (2015), definem o termo design de narrativa de jogos. Entretanto, o estudo oferece contributos ao design de narrativas interactivas para além do contexto dos videojogos. Segundo os autores: Design de Narrativa de Jogos é a arte de contar histórias num jogo de computador utilizando as técnicas e dispositivos disponíveis. É a arte de usar a jogabilidade e a soma dos métodos visuais e acústicos para criar uma experiência divertida e envolvente para os jogadores. 24 (Lemay et al. 2015) Para os autores, o designer de narrativa de jogos trabalha no campo do design de narrativas e combina as capacidades de um escritor e um designer de jogos. Isto esclarece que, na perceção dos autores, o design de narrativa combina habilidades criativas e estratégicas, unindo conteúdo à estrutura da narrativa. Em resumo, “o designer de narrativas organiza e integra a história dentro do jogo, utilizando as mecânicas, designs e ativos disponíveis.” (Lemay et. al. 2015) Os autores complementam a discussão ao elaborar o papel que um designer de narrativas deve desempenhar no desenvolvimento de um videojogo. Para Hepler (2015), um designer de narrativas é alguém que está integrado no desenvolvimento do jogo, cria conteúdos para a história, desenvolvendo personagens, mundos, diálogos e outros. O designer de narrativa deve planear a história que oferece espaço para os jogadores fazerem as suas próprias escolhas e convencê-los a segurar as rédeas da narrativa. Lemay (2015) sintetiza a função de um designer de narrativas como um nexo de informações sobre a narrativa e a capacidade de a defender. Com o conhecimento sobre a narrativa, o designer pode desenvolvê-la e adaptá-la ao longo da criação do videojogo. Para Finley (2015), o designer de narrativas é a combinação de um escritor de jogos com um designer de jogos e garantir que a história esteja integrada com os momentos de jogo, independentemente de as mecânicas e os conteúdos serem criados juntos ou um antes do outro. É preciso entender sobre o mundo do jogo, o desenvolvimento da história, os elementos que vão envolver o jogador e como é que o jogo interage com a estória através da mecânica. Heussner (2015) define o designer de narrativa como a combinação entre escrita e design de jogos, e não a soma destes campos, mas onde se interseccionam. Heussner (2015) resume o seu entendimento de design de narrativa como “a arte e o domínio de desenvolver, contar e implementar uma história num ambiente interativo.” 25 (Lemay et al. 2015) 24 T.A.: “Game Narrative Design is the art of telling a story in a computer game using the techniques and devices available. It is the art of using gameplay and the sum of visual and acoustic methods to create an entertaining and engaging experience for players.” (Lemay et. al. 2015) 25 T.A.: “... the art and the mastery of developing, telling, and implementing a story in an interactive environment.” (Lemay et al. 2015) 55 Em resumo, podemos entender o design de narrativa como o ofício de desenhar uma narrativa que une conteúdo e interação, integrando a ação do interator com o desdobrar dos eventos da narrativa dentro de um sistema interativo. E ao entender o que é o design de narrativa, podemos assim começar a entender quais os meios possíveis para se desenhar uma narrativa interativa. Quais métodos e estratégias que podem ser usados para se desenhar uma narrativa interativa. 2.2 Levantamento de ferramentas de autoria para o desenho de narrativas interativas: jogos e aplicações não-jogos Para construir uma ferramenta de autoria, é preciso entender como acontece a criação de narrativas noutros sistemas digitais. Selecionámos como estudo de caso jogos e aplicações não-jogos que se comportam como ferramentas de autoria. Através de uma análise destes sistemas procurámos encontrar possíveis soluções para a construção de uma ferramenta de autoria. 2.2.1 Objetivos Este levantamento de ferramentas de autoria tem como objetivo perceber como um sistema possibilita o desenho de narrativas interativas. Procurámos entender como é que estes sistemas concebem o processo de autoria e quais os princípios e padrões do design utilizados para este fim. Ao relacionarmos videojogos e aplicações não-jogos, procuramos perceber as diferenças e similaridades de como a autoria ocorre em cada um destes tipos de sistemas; perceber as funcionalidades e soluções de design que existem em comum e quais são particularidades de cada tipo de sistema; perceber como um sistema ludificado pode facilitar a autoria; e, por fim, entender como é que estes sistemas podem contribuir para o estudo do design da travessia do interator para narrativas interativas. 2.2.2 Métodos e Procedimentos As análises foram feitas através de vídeos, imagens, materiais de divulgação oficiais e, quando possível, experienciando diretamente. Descrevemos os elementos usados para a autoria em cada sistema e como se organizam no layout da interface. Através da descrição é possível perceber as particularidades de cada sistema e como ocorre o processo de criação em cada um deles. Após a descrição, procurámos identificar e descrever os princípios do design de Interação, Arquitetura da Informação e Experiência de Utilização que oferecem contributos a ferramenta de autoria que estejam presentes nos sistemas levantados. Os objetivos deste levantamento é entender como cada um dos princípios do design pode otimizar o processo de autoria na ferramenta. Foram levantados os padrões de design existentes nos sistemas analisados. Observamos os padrões de design visando perceber soluções pragmáticas para a interação e a interface dos sistemas. 56 Posteriormente foram relacionados os padrões de design com os princípios de design, visando entender como é que os princípios previamente levantados se convertem em padrões. Os padrões de design foram divididos em dois grupos: 1) Estratégias de Interação para os elementos do design de interação; 2) Estruturas de Interface para os elementos de design da interface. Assim podemos distinguir os padrões que estão ligados a manipulação de elementos dos que estão ligados a organização no layout da interface. De seguida, levantamos o número de ocorrências de cada ponto listado de cada grupo. Com este levantamento podemos perceber quais as soluções comuns nos sistemas de design de narrativa. 2.2.3 Caracterização da amostra As amostras desta análise consistem em aplicações não-jogos e videojogos que têm o processo de autoria como elemento crítico e a possibilidade de partilha das narrativas criadas. Selecionamos para a amostra sistemas digitais que apresentem indícios de elementos levantados neste estudo. A amostra é composta por 12 sistemas, 3 videojogos e 9 aplicações (não-jogos) descritas abaixo. Os resultados da criação em cada uma das ferramentas são ou uma narrativa interativa, ou uma narrativa multimedia. Todos os sistemas oferecem ferramentas para a criação de experiências que possam ser vivenciadas por outras pessoas. Tabela 2.1. Sumário das ferramentas de autoria Sistema de Autoria Descrição Plataforma Ano URL articy:draft 3 A aplicação oferece uma solução profissional para escrita de jogos, planeamento e gerenciamento de conteúdo. De scriptwriting a fluxogramas aninhados, modelos editáveis, editor de localização e simulação de história a partilha com os principais softwares de jogos. Desktop App 2014 https://www.arti cy.com/ Eko Studio Aplicação que permite criação de narrativas audiovisuais interativas. Permite aos participantes fazer escolhas que moldam histórias em tempo real. Web-based 2010 https://studio.ek o.com/ Inklerwriter free Inklewriter é uma ferramenta gratuita projetada para a escrita e publicação de histórias interativas. Web-based 2011 https://www.ink lestudios.com/in klewriter/ Mario Paint Videojogo em que o jogador pode desenhar, criar animações e compor músicas. Super Nintendo 1992 https://en.wikip edia.org/wiki/M ario_Paint RPG Maker MV Aplicação que permite ao interator criar os seus próprios videojogos, com ênfase no género RPG, sem requerer conhecimentos de programação ou artes visuais. Desktop App, Nintendo Switch 2015 https://www.rpg makerweb.com/ products/rpgmaker-mv 57 Stonaway.io A Stornaway.io é uma aplicação que permite planear, escrever, mapear a história e publicar as histórias interativas na web, aplicações e plataformas SVOD. Web-based 2019 https://www.sto rnaway.io/ Story Speaker Um suplemento ao Google Docs que permite criar histórias interativas sem necessidade de codificação. Web-based 2017 https://experime nts.withgoogle.c om/storyspeaker StoryMapJS Uma ferramenta gratuita que permite contar histórias na web que destacam os locais de uma série de eventos. Web-based 2017 https://storymap .knightlab.com/ StoryPlaces Aplicação que permite a criação de experiências que explorem a poética da literatura locativa. Web-based 2015 http://storyplace s.soton.ac.uk/ Super Mario Maker 1 e 2 Videojogos em que se pode criar e jogar cenários customizados baseados nos títulos da franquia Super Mario Bros e partilhá-los online com outros jogadores. Nintendo Wii U, Nintendo 3DS, Nintendo Switch 2015, 2019 https://www.nin tendo.pt/Jogos/ Wii-U/SuperMario-Maker892704.html; https://supermar iomaker.nintend o.com/ The Adventures of Batman & Robin - Cartoon Maker Videojogo inspirado na série Batman: Animated Series (1992-1994) que permite a criação de desenhos e animações de forma simplificada. Desktop App 1995 https://warnerbr os.fandom.com/ wiki/The_Adve ntures_of_Batm an_%26_Robin: _Cartoon_Make r Twine Aplicação open-source usado para o desenvolvimento de narrativas e jogos de hipertexto. Web-based, Desktop App 2009 https://twinery.o rg/ 64 um mapa dividido em grelha para a criação em quadrantes (Figura 2.7.d), bibliotecas de elementos criados e pré-definidos (figura 2.7.e) agrupados em abas. Na parte superior do ecrã encontra-se a barra de ferramentas com uma vasta gama de funcionalidades como: funcionalidades gerais do ficheiro; desenho; ampliação; pré-visualização dos resultados. Acima da barra de ferramentas, encontra-se a barra de acesso a outras secções do sistema (Figura 2.7.f) que permitem acesso a configurações avançadas do sistema e da narrativa. Figura 2.7: Interface da aplicação RPG Maker MV (2015). Fonte: https://www.blog.mattlamont.com/creating-rpg-maker-project/, em 09/05/20. A criação de uma narrativa ocorre diretamente na grelha da área do trabalho com o auxílio das ferramentas de desenho na barra de ferramentas e com as bibliotecas de elementos. Para recursos avançados, a sua interface permite acesso a painéis específicos, acessíveis pela barra de secções, para cada momento da criação. O interator tem acesso a painéis de actores, eventos, entre outros com configurações para cada aspeto da narrativa. Estes recursos são apresentados em painéis reservados para cada fim. Stornaway.io O Stornaway.io (2019) é um sistema que permite criar histórias de vídeo interativas que permite fazer diferentes escolhas, perspetivas e desvendar segredos. O elemento central deste sistema é a ilha da história, 29 um evento da narrativa que pode ser uma cena, um local ou um clipe. Cada ilha é mostrada 29 T.A.: Story island. 65 como uma caixa, com grafos que mostram como ela se conecta a outras ilhas. O mapa (área de trabalho) da história, com ilhas e grafos, auxilia o controlo dos caminhos possíveis na narrativa. A interface do Stornaway é dividida em: barra de ferramentas (Figura 2.8.a); área de trabalho (Figura 2.8.b); painel de tarefas (Figura 2.8.c). A barra de ferramentas combina as funcionalidades de criação, visualização, publicação e configuração do projecto. A área de trabalho é onde o interator organiza o fluxo da narrativa. Dentro da área de trabalho há botões para adicionar eventos (Figura 2.8.f) e controlo do zoom (Figura 2.8.g) de fácil acesso. Figura 2.8: Interface Stornaway.io (2019). Para criar uma narrativa, o interator pode adicionar quantos eventos desejar e conectá-los com um clique e arraste dos grafos entre os eventos. Cada evento pode ser configurado no painel de tarefas. O interator pode inserir media, controlar a forma como as escolhas se apresentam ao interator final, por onde a narrativa começa, entre outras. O interator pode associar mais do que um conteúdo por evento com diferentes ligações. Isso permite que a travessia por um evento mude conforme o evento de origem. Story Speaker O Story Speaker (2017) funciona como um suplemento ao do Google Docs (2005) e usa a interface de editor de texto para a criação das narrativas. O Story Speaker (2017) permite que qualquer pessoa crie histórias interativas e sem necessidade de conhecimentos de programação. Para escrever a história é necessário um documento do Google Docs (2005), clicar num botão e um dispositivo do Google Home conectados à sua conta e pode reproduzir instantaneamente a narrativa. Story Speaker (2017) pertence 66 à iniciativa da Experiments with Google e algumas das suas funcionalidades encontram-se em fase de teste. A interface do Story Speaker (2017) consiste numa barra lateral inserida na interface padrão do editor de texto, Google Docs (2005) (Figura 2.9.a), que agrupa as funcionalidades em abas. O editor de texto tem uma interface dividida em duas partes: área de trabalho (Figura 2.9.a) e barra de ferramentas (Figura 2.9.b). Através do editor de texto o interator escreve uma narrativa. Com a barra de tarefas o interator tem acesso a modelos de narrativas, comandos de configuração, pré-visualização e publicação, sem interferir com a interface do editor de texto. O sistema usa a indentação de texto para conectar eventos e estruturar a narrativa. O uso deste recurso torna o design da narrativa mais simples ao interator. Este meio de criação é usado também para possibilitar a vivência das narrativas através do Google Home. Através do aparelho adicional, habilitamse os comandos de voz e ouvirmos a história de forma narrada pelo próprio Google Home, tornar-se assim uma experiência auditiva. Figura 2.9: Barra de tarefas do Story Speaker (2017) junto ao editor de texto Google Docs (2005). Fonte: https://experiments.withgoogle.com/story-speaker, em 09/05/2020. StoryMapJS StoryMapJS (2017) é uma ferramenta de autoria que permite contar histórias baseadas na localização. O interator é capaz de criar eventos de uma narrativa e associar este evento a uma localização no mapa. Desta forma, o interator pode contar histórias na web que destacam os locais dos eventos. A interface do StoryMapJS (2017) possui três seções principais: 1) mapa (Figura 2.10.a); 2) área de trabalho (Figura 2.10.b); 3) painel de tarefas (Figura 2.10.c). O mapa é o elemento de maior destaque na interface. No mapa o interator pode selecionar os locais que os eventos da narrativa 67 retratam. Na área de trabalho o interator tem disponível dois conjuntos de painéis para as configurações dos eventos da narrativa, um painel para as medias (Figura 2.10.d) e um painel para o texto (Figura 2.10.e). A barra de ferramentas está localizada à esquerda do ecrã e apresenta uma lista com os eventos da narrativa nomeados slides. Na parte superior do mapa estão localizados os botões de visualização (Figura 2.10.g). Na parte superior da interface, a esquerda (Figura 2.10.f) e a direita (Figura 2.10.h), estão localizadas as ferramentas gerais do sistema. Figura 2.10: Interface do StoryMapJS (2017). A criação da narrativa ocorre essencialmente com a escolha da localização do evento no mapa. Para este fim, o interator pode usar o duplo clique diretamente no mapa para criar o evento (Figura 2.10.i) ou escrever a morada específica na barra de busca (Figura 2.10.j). Na área de trabalho o interator pode carregar uma imagem no painel de media, dar crédito a imagem e criar um texto alternativo para uma melhor acessibilidade. No painel de texto da área de trabalho o interator tem disponível um editor de texto para construir o conteúdo do evento. O painel de tarefas pode atribuir uma imagem de capa para a narrativa. Também é permitido ordenar a sequência de eventos da narrativa através do drag and drop dos itens na lista. Como alternativa à criação no mapa, o painel de tarefas permite adicionar eventos diretamente na lista e posteriormente configurar a localização do evento. O sistema permite apenas narrativas de travessias lineares, permitindo apenas atravessar para frente ou para trás na sequência de eventos. StoryPlaces O StoryPlaces começou em 2015 como um projecto de pesquisa interdisciplinar para explorar a poética da narrativa baseada em localização, com base na Universidade de Southampton, como uma colaboração entre os departamentos de Eletrónica e Ciência da Computação e Inglês. 68 O StoryPlaces (2015) usa a geolocalização como elemento narrativo para a experiência. A interface do sistema consiste num painel à esquerda (Figura 2.11.a) com as funcionalidades de criação dos eventos da narrativa, que agrupa as funcionalidades em abas. Na margem inferior do painel está a barra de ferramentas (Figura 2.11.b). Esta barra altera-se conforme a aba selecionada do painel. À direita do ecrã está o mapa (Figura 2.11.c) onde ficam localizados os pins (Figura 2.11.e), que representam a localização dos eventos da narrativa. Figura 2.11: Interface com uso de mapa em Story Places (2015). Fonte: http://storyplaces.soton.ac.uk/, em 09/05/20. Os eventos da narrativa surgem em lista no painel e, ao selecionarmos um evento, o painel altera o seu conteúdo sem alterar o espaço reservado na interface. O interator tem acesso aos recursos num único espaço, desta forma evita-se que o interator se perca durante a criação da narrativa. A criação de narrativa do StoryPlaces (2015) diferencia-se das outras por haver pouca interação direta com o mapa. As configurações de cada evento ocorrem em grande parte diretamente no painel, com a inserção de dados nos sítios específicos. Interage-se com o mapa apenas quando se deseja arrastá-lo ou quando se utiliza a ação de inserir um pin ao mapa, como uma das formas de determinar o sítio em que ocorre o evento. Apesar de não haver grafos de ligações entre os eventos, o StoryPlaces (2015) permite a ligação entre os eventos. Cada evento da narrativa pode ser ativado apenas quando o interator atinge as condições necessárias. Cada evento possui as suas restrições da narrativa 30 (Figura 2.12.a) que mediam as relações entre os eventos da narrativa. 30 T.A.: Narrative Constraints. 69 Figura 2.12: Restrições da narrativa em Story Places (2015). Super Mario Maker 1 e 2 O Super Mario Maker (2015) e o Super Mario Maker 2 (2019) são jogos eletrónicos desenvolvidos pela Nintendo para a consola Wii U, Nintendo 3DS e Nintendo Switch, onde o interator pode criar e jogar diferentes níveis personalizados baseados em jogos da franquia Super Mario, podendo partilhar online e jogar os níveis criados por outros interatores. O Super Mario Maker (2015) apresenta uma área de trabalho central (Figura 2.13.a) e reserva as margens da interface para a biblioteca de elementos (Figura 2.13.b), as funcionalidades de visualização (Figura 2.13.c) e para os menus específicos (Figura 2.13.d e Figura 2.13.e). A margem superior é destinada à biblioteca de elementos para a criação dos cenários, sendo possível ao interator escolher os elementos aos quais pretende ter fácil acesso dentro deste painel. A margem superior tem funcionalidades de visualização dos resultados enquanto que as outras margens ficam reservadas a ferramentas e comandos para a configuração do cenário. A aprendizagem da criação inicia-se de forma lúdica. Inicialmente o interator é colocado num cenário do jogo em que cai inevitavelmente num buraco que o leva pela primeira vez para um editor de níveis limitado, com poucas opções para finalizar um nível apresentado. Após concluir a tarefa, o interator transita gradualmente para um editor de níveis mais complexo. A criação de níveis ocorre centrada no mecanismo de drag and drop de elementos da biblioteca para a área de trabalho. 70 Figura 2.13: Interface do videojogo Super Mario Maker 1 (2015). Fonte: https://www.gameskinny.com/cow4f/fast-forward-review-super-mario-maker em 15/06//2021. Em Super Mario Maker 2 (2019) as listas circulares (Figuras 2.14.a) foram adicionadas para tornar o acesso mais fácil às bibliotecas de elementos. Ao clicar num botão do comando, o interator tem acesso às diferentes listas organizadas em círculos, onde cada círculo é reservado a uma categoria de elementos. Estas listas aproveitam a interação através dos direcionais do comando para organizar as informações. Figura 2.14: Listas em círculos em Super Mario Maker 2 (2019). Fonte: https://www.gameskinny.com/cow4f/fast-forward-review-super-mario-maker, em 09/05/2020. The Adventures of Batman & Robin — Cartoon Maker Inspirado no sucesso da série Batman: Animated Series (1992-1994) e publicado pela Warner Bros. Interactive Entertainment, The Adventures of Batman & Robin — Cartoon Maker (1995) permite a 71 criação de desenhos e animações de forma simplificada. Com o uso de bibliotecas de medias, microfone e ferramentas de desenho, o interator pode criar e animar um episódio para a série. A interface do sistema divide-se numa área de trabalho ao centro (Figura 2.15.a). Na margem superior do ecrã (Figura 2.15.b) está a biblioteca de medias, cada uma com um painel modal próprio para a navegação entre os elementos. Na margem direita (Figura 2.15.c) está a barra de ferramentas com funcionalidades gerais do projecto. A margem inferior do ecrã (Figura 2.15.d) está na barra de ferramentas com funcionalidades de visualização da narrativa. Na margem a direita (Figura 2.15.e) está a barra de ferramentas com funcionalidades de desenho. Figura 2.15: Interface de The Adventures of Batman & Robin Cartoon Maker (1995). Fonte: https://www.old-games.com/download/10001/adventures-of-batman-robin-cartoon, em 09/05/2020. The Adventures of Batman & Robin Cartoon Maker (1995), tratado também como Cartoon Maker neste documento, simplifica conceitos básicos de software de animação, como keyframe e timeline, de forma direta. Utiliza-se da ordem de inserção de elementos no canvas para determinar a sequência de aparição destes elementos numa cena da animação. Os parâmetros de espaço e o tempo do elemento são determinados pelo trajeto em que o cursor percorre na área de trabalho ao arrastar um elemento. Twine O Twine (2009) é um sistema open-source popular no desenvolvimento de narrativas e jogos de hipertexto. O Twine (2009) enfatiza a estrutura visual do hipertexto e não requer conhecimento de linguagem de programação, porém podem ajudar os interatores. No entanto, o Twine (2009) é 72 considerado uma ferramenta que pode ser usada por qualquer pessoa interessada em ficção interativa e jogos experimentais A interface do Twine (2009) divide-se em área de trabalho (Figura 2.16.a) e barra de ferramentas (Figura 2.16.d). O interator utiliza a barra de ferramentas para criar passagens, eventos da narrativa, e posiciona-os na área de trabalho. Cada passagem da história consiste num bloco de texto onde o interator escreve a sua história (Figura 2.16.b). As interligações de uma passagem (Figura 2.16.c), com uma formatação específica de texto no corpo de texto 31 determina as conexões entre as passagens. A organização da narrativa dá-se em forma de nós e grafos na área de trabalho. Na barra de ferramentas o interator também tem acesso a modos de visualização da área de trabalho e o recurso para ver os resultados da narrativa. Figura 2.16: Interface com representação de nós e grafos em Twine (2009). Fonte: https://twinery.org/, em 09/05/20. As ferramentas de autoria podem ser concebidas de diversas formas. Nestes levantamentos observamos algumas das possíveis soluções para um processo de autoria voltado a narrativas. Os levantamentos fornecem alternativas para um sistema de design de narrativas e para o design da travessia do interator na narrativa interativa. Com estas informações podemos procurar soluções de design que ofereçam contributos no desenvolvimento de uma ferramenta de autoria para narrativas interativas. 31 Para os utilizadores que possuam algum conhecimento de programação, o Twine permite-nos personalizar os aspetos visuais através de linguagem de marcação HTML diretamente no corpo do texto. Para edição em CSS e JavaScript, o Twine disponibiliza painéis específicos. 73 2.3 Um levantamento de ocorrências de estratégias de interação (presentes em ferramentas de autoria para o desenho de narrativas interativas) O design de uma narrativa interativa requer o uso de uma ferramenta apropriada que permite criar a narrativa, mas também que seja projetada para a melhor experiência do interator ao desenhar a narrativa interativa. Entender como uma ferramenta pode influenciar o design de uma narrativa é crítico para a construção de uma ferramenta de autoria. Kitromili et al. (2018) concluem que a experiência de autoria é subjetiva e que diferentes projectos criativos apresentam diferentes requerimentos, gerando diferentes pontos de tensão, ou atritos, para o interator. Compreender como as ferramentas influenciam a escrita interativa é um desafio-chave na área da storytelling digital interativo. Isso potencialmente influencia a escolha de ferramentas para projetos específicos, o design e o desenvolvimento de novas plataformas e a análise crítica de trabalhos interativos. Desenvolver um entendimento é desafiador, pois a experiência de autoria é subjetiva e diferentes projetos criativos têm requisitos diferentes e, portanto, geram atritos diferentes. 32 Kitromili et. al. (2018, 520) Projetar uma ferramenta de autoria para o design de narrativas interativas deve considerar os conceitos do design de experiência do interator, o impacto que as estratégias de interação e de interface têm sobre o sistema. Uma ferramenta mal projetada reduz a acessibilidade e torna o sistema restrito ao interator que não apresenta os conhecimentos técnicos apropriados. O design de ferramentas interativas de autoria narrativa é um processo emergente do modelo de dados narrativo subjacente que a ferramenta suporta. Embora isso faça sentido do ponto de vista estrutural, é possível que estejamos a ignorar o impacto da experiência do utilizador (UX) de várias decisões de design e paradigmas de interface. Sem uma UX bem projetada, a acessibilidade é reduzida e os sistemas ficam restritos aos usuários com o conhecimento técnico apropriado, o que pode resultar numa experiência frustrante para o utilizador e contribuir para uma taxa reduzida de adoção pelas comunidades de ficção interativa. 33 (Hargood et al. 2018, 501) 32 T.A.:” Understanding how tools influence interactive writing is a key challenge in the area of interactive digital storytelling. This potentially influences the choice of tools for particular projects, the design and development of new platforms, and critical analysis of interactive works. Developing an understanding is challenging, as authoring experience is subjective, and different creative projects have different requirements and therefore generate different frictions.” Kitromili et. al. (2018, 520) 33 T.A.:”The design of interactive narrative authoring tools is an emergent process from the underlying narrative data model that the tool supports. While this makes sense from a structural point of view it is possible that we are ignoring the User Experience (UX) impact of a variety of design decisions and interface paradigms. Without welldesigned UX, accessibility is reduced and systems become restricted to users with the appropriate technical knowhow, which can result in a frustrating user experience and can contribute to a reduced rate of adoption by interactive fiction communities.” Hargood et. al. (2018, 501) 80 Os levantamentos de ferramentas de autoria mostram-nos a relevância de uma AI para criação de narrativas interativas numa ferramenta de autoria. Uma ferramenta de autoria deve ter uma hierarquia facilmente reconhecível, tolerar os erros do interator e fornecer as funcionalidades necessárias para cada momento da criação. No campo do design da arquitetura da informação, Sousa (2017) sumariza 17 princípios de design da arquitetura da informação dos quais ressaltamos os encontrados nos sistemas levantados e mais relevantes a ferramenta de autoria de design de narrativa interativa. Entre os 17 princípios, ressaltamos três: 1) Hierarquia; 2) Prevenção dos erros ou tolerância; 3) Restrição de âmbito. Tabela 2.3: Trecho retirado ipsis verbis da Tabela 2. Princípios de design da Arquitetura da Informações (Sousa 2017, 70-71). PRINCÍPIOS DE DESIGN DA ARQUITETURA DA INFORMAÇÃO Hierarquia A informação deve ser organizada em grupos de forma a gerir a complexidade e a reforçar as relações entre a informação (Lidwell et al., 2003). Através da representação de várias camadas de significado e de leitura é possível reduzir o ruído e enriquecer o conteúdo (Tufte, 1990). Prevenção dos erros ou tolerância O erro pode ser minimizado: (i) prevenindo — utilizando uma linguagem clara, breve e convencional; (ii) protegendo — guardando a informação dos utilizadores (e.g. salvar o email como rascunho à medida que se vai escrevendo); (iii) informando — se o erro acontecer devese comunicar ao utilizador o que aconteceu. Deve-se proteger o utilizador dos erros e minimizar ao máximo as suas consequências (Wodtke & Govella, 2009) através de boas affordances, dando a possibilidade de reverter às ações, criando redes de segurança e fornecendo sempre que necessário confirmações e avisos (Lidwell et al., 2003). Restrição de âmbito Quando estamos perante muita informação deve-se dividir esta em módulos relacionados entre si, de forma a orientar as designações para as necessidades do público específico. Dentro do possível, deve-se também restringir as áreas de domínio de forma a atingir uma representação mais óbvia e efetiva (Rosenfeld & Morville, 2007). Os sistemas levantados utilizam-se de uma hierarquia visual similar entre si e de fácil assimilação por parte do interator. Os sistemas levantados usam uma área de trabalho bem definida e com forte presença na interface. Em torno da área de trabalho, todos os outros elementos são posicionados no layout consoante a esta área de trabalho. Barras de ferramentas, painéis de tarefas e outros elementos que se encontram abaixo na hierarquia visual das interfaces e ocupam uma área menor no ecrã. Segundo os levantamentos de Sousa (2017), o princípio de Hierarquia é percebido quando a informação está “organizada em grupos de forma a gerir a complexidade e a reforçar as relações entre a informações” 42 . Todos os sistemas levantados apresentam uma hierarquia bem definida. Entretanto, como exemplo, observamos o videojogo Mario Paint (1992), com uma hierarquia para a interface simples e de fácil assimilação. O sistema possui uma área de trabalho ao centro do ecrã, com uma barra de ferramentas na margem inferior e uma biblioteca de elementos na margem superior. 42 Trecho retirado ipsis verbis da Tabela 2. Princípios de design da Arquitetura da Informações (Sousa 2017, 70). 81 Figura 2.22: Exemplo de Hierarquia do Mario Paint (1992). Fonte: https://www.mariowiki.com/Mario_Paint, em 09/05/2020. Uma hierarquia clara entre os elementos num sistema digital consegue otimizar a experiência do interator. Numa ferramenta de autoria, entender quais os elementos mais importantes de forma intuitiva é um ponto crítico e requer uma hierarquia bem estruturada de informações. Nos sistemas levantados, foi possível reconhecer os esforços dos sistemas em prevenir eventuais erros ou minimizá-los quando possível. Seja através de salvamento automático ou mensagem de alerta para potenciais erros durante a criação. Ferramentas de autoria eficientes devem prever as possibilidades de erros por parte do interator e apresentar um comportamento que minimize as consequências destes erros. O princípio de Prevenção dos erros ou tolerância, segundo os levantamentos de Sousa (2017) entendido por “o erro pode ser minimizado” e complementa ao explicar que este princípio ocorre de três formas: 1) com prevenção, “utilizando uma linguagem clara breve e convencional”; 2) com proteção, “guardando a informação dos utilizadores”; 3) com informação, “o erro acontecer deve-se comunicar ao utilizador o que aconteceu” 43 (Sousa 2017, 71). O sistema Storaway.io (2019) exemplifica este princípio na sua forma de prevenção ao interromper o fluxo de trabalho do interator com uma mensagem clara e direta do erro que o interator está a cometer. Figura 2.23: Exemplo de Prevenção dos erros ou tolerância — Prevenção do Stornaway.io (2019). 43 Trecho retirado ipsis verbis da Tabela 2. Princípios de design da Arquitetura da Informações (Sousa 2017, 71). 82 O princípio de Prevenção dos erros ou tolerância, na sua forma de proteção, pode ser percebido, por exemplo, no inklewriter free (2011) no momento em que se está a escrever. Enquanto o interator está a inserir o texto no evento da narrativa, o sistema guarda o seu progresso automaticamente para prevenir perda de dados e fornece um feedback visual no canto superior direito do ecrã (Figura 2.24). Figura 2.24: Exemplo de Prevenção dos erros ou tolerância — Proteção do inklewriter free (2011). O sistema Eko Studio (2015) usa o princípio de Prevenção dos erros ou tolerância, na sua forma de informação, quando indica a existência de um erro, comunica qual é o erro especificamente e tenta corrigi-lo (Figura 2.25). Figura 2.25: Exemplo de Prevenção dos erros ou tolerância — Informação do Eko Studio (2015). O processo criativo envolve muitas tentativas e um processo interativo na procura da melhor solução. O sistema digital deve oferecer ao interator a segurança para evitar erros críticos que comprometem o desenvolvimento e qualidade do trabalho. Uma tolerância a eventuais erros por parte do interator é essencial para a ferramenta de autoria. Observamos nos sistemas levantados o uso de separadores e segmentações das funcionalidades durante a criação. Algumas funcionalidades estão sempre visíveis, entretanto outras funcionalidades estão reservadas a sítios específicos e são evocados num momento mais adequado para o seu uso. Todos os sistemas levantados apresentaram, de diferentes formas, o princípio de Restrição de âmbito. O 83 princípio de restrição de âmbito, segundo o levantamento de Sousa (2017), ocorre “quando estamos perante muita informação deve-se dividir esta em módulos relacionados entre si, de forma a orientar as designações para as necessidades do público específico”. 44 Podemos observar este comportamento no StoryPlaces (2015), por exemplo, as secções são divididas em abas no painel de tarefas. As informações de cada evento da narrativa estão restritas em painéis dedicados acessados de forma individual. Figura 2.26: Exemplo de Restrição de âmbito do StoryPlaces (2015)). 2.3.3 Princípios de design da experiência O processo de criar uma narrativa interativa pode ser custoso ao interator e o sistema deve tornar esta experiência otimizada do início ao fim para o interator. A experiência do interator é sobre como o produto ou serviço funciona visto de fora quando uma pessoa tem contacto com o sistema (Garrett, 2011, 6). O website Usability.org 45 complementa o nosso entendimento dizendo que as melhores práticas da experiência do interator procuram promover uma melhoria da qualidade da interação do interator com as perceções sobre o sistema (Usability.org, 2014). Com isto em mente, procuramos nos sistemas analisados (Secção 2.2.4) os princípios da Experiência de Utilização, sumariados por Sousa (2017), que promovam a qualidade na interação do interator com o sistema e ofereçam contributos para uma ferramenta de autoria. 44 Trecho retirado ipsis verbis da Tabela 2. Princípios de design da Arquitetura da Informações (Sousa 2017, 71). 45 Usability.org. User Experience Basics. Consultado em 17 de Junho, 2021. https://www.usability.gov/what-andwhy/user-experience.html. 84 Os levantamentos de ferramentas de autoria mostram-nos a relevância da experiência de utilização quando observamos estes sistemas tornarem a criação um processo fácil, familiar e com uma boa relação custo/benefício, onde o interator é capaz de prever as consequências de seus atos. Com isto em mente, entre os princípios levantados por Sousa (2017) observamos os princípios do design de experiência de utilização mais relevantes a ferramenta de autoria e ressaltamos três: 1) Afinidade; 2) Causa-efeito; 3) Relação esforço/recompensa. Tabela 2.4. Trecho retirado ipsis verbis da Tabela 5. Princípios de design da Experiência de Utilização (Sousa 2017, 81-83) PRINCÍPIOS DE DESIGN DA EXPERIÊNCIA DE UTILIZAÇÃO Afinidade A afinidade é um sentimento que se cria com a Interface quando esta é fácil de compreender, independentemente da complexidade do sistema e das operações que ocorrem para além dela. Este sentimento ajuda os utilizadores a concentrarem-se nos seus objetivos e tarefas, tornando a Interface invisível. A Interface deve ser desenhada de forma a criar este sentimento de afinidade: como mediadora da comunicação o seu papel é facilitar (Gong, 2009). As pessoas tendem a ser mais facilmente persuadidas por plataformas digitais que de alguma forma são semelhantes a elas (Fogg, 2003a). Causa-efeito As simulações podem persuadir as pessoas a mudar as suas atitudes ou comportamentos através da possibilidade de observar uma relação direta entre a causa e o efeito (Fogg, 2003a). Relação esforço/recompensa Os utilizadores estão disponíveis a tolerar o esforço necessário para lidar com a complexidade de algumas funcionalidades se a recompensa valer a pena (Cooper et al., 2007). A utilização das plataformas digitais para reduzir atividades complexas a tarefas simples aumenta o benefício/custo, influenciando assim o utilizador à sua utilização para a concretização dessa tarefa (Fogg, 2003a). Alguns dos sistemas analisados apresentam interfaces com um fácil acesso para o interator, promovendo a imersão durante a criação e auxiliando o interator a concentrar-se nas suas tarefas. Estes sistemas podem apresentar semelhanças a outros sistemas na tentativa de promover uma maior afinidade para o interator. O princípio de Afinidade, segundo o levantamento de Sousa (2017), “é um sentimento que se cria com a Interface quando esta é fácil de compreender, independentemente da complexidade do sistema e das operações que ocorrem para além dela”. 46 O sistema Story Speaker (2017) faz uso da interface do Google Docs (2005) para promover um processo de criação centrado na escrita de um editor de texto. O interator quando está a criar a sua narrativa, pode concentrar-se apenas em escrever o texto. Estes dois fatores promovem uma maior afinidade com o sistema. 46 Trecho retirado ipsis verbis da Tabela 5. Princípios de design da Experiência de Utilização (Sousa 2017, 81). 85 Figura 2.27: Exemplo de Afinidade no Story Speaker (2017). Fonte: https://youtu.be/wsrzvYYvhH8?t=43, timecode 00:00:43:00, em 21/06//2021. Uma ferramenta de autoria, em princípio, pode não ser um sistema digital comum ao interator. Os seus contextos de uso tendem a ser particulares e de pouca familiaridade. O princípio de afinidade pode tornar a ferramenta de autoria mais fácil de ser compreendida e gerar confiança no interator durante o processo de desenvolvimento de uma narrativa interactiva. A criação de uma narrativa interactiva pode envolver muitos procedimentos e ser custosa ao interator. Uma ferramenta de autoria eficiente permite visualizar simulações das consequências das ações do interator. A maior parte dos sistemas levantados permitem avaliar as consequências das criações, manifestando o princípio da Causa-efeito. O princípio da Causa-efeito, segundo os levantamentos de (Sousa 2017), apresenta-se quando o sistema gera simulações que permitem ao interator “mudar as suas atitudes ou comportamentos através da possibilidade de observar uma relação direta entre a causa e o efeito”. 47 O Eko Studio (2010) oferece um exemplo do uso do princípio de Causa-efeito. A qualquer momento da criação, o interator pode clicar no botão “Preview”, no canto superior do ecrã, para ver uma simulação do resultado final. Ao clicar no botão, o sistema mostra o resultado num mockup de um telemóvel e uma mensagem de aviso a dizer que, o que se está a ver, é apenas uma simulação aproximada. 47 Trecho retirado ipsis verbis da Tabela 5. Princípios de design da Experiência de Utilização (Sousa 2017, 81). 86 Figura 2.28: Exemplo de Causa-efeito no Eko Studio (2010). Observar os efeitos gerados pelas ações de forma simples e direta pode prevenir erros críticos. A possibilidade de observar os efeitos das suas ações, permite uma melhor tomada de decisões e gestão de recursos por parte do interator. Este princípio pode influenciar o comportamento do interator e tornar a sua experiência mais assertiva. Alguns dos sistemas levantados oferecem soluções para lidar com a complexidade do processo de criação de uma narrativa interativa. Estes sistemas permitem minimizar o esforço do interator transformando tarefas complexas em ações simples, evocando o princípio de Relação esforço/recompensa. Segundo os levantamentos de Sousa (2017), o princípio da Relação esforço/recompensa refere-se à disposição dos interatores “a tolerar o esforço necessário para lidar com a complexidade de algumas funcionalidades se a recompensa valer a pena” 48 e que sistemas digitais devem “reduzir atividades complexas a tarefas simples aumenta o benefício/custo”. 49 O RPG Maker MV (2015) evoca este princípio quando o interator está a criar um mapa, por exemplo, para sua narrativa e deve preencher uma grelha, ponto a ponto, com o elemento desejado. O sistema facilita este processo ao permitir que o interator escolha um elemento, clique e arraste por todos os pontos da grelha que desejar, num único movimento com o rato. Desta forma, criar mapas requer um esforço baixo e uma recompensa alta em economia de tempo desenvolvendo a narrativa. 48 Trecho retirado ipsis verbis da Tabela 5. Princípios de design da Experiência de Utilização (Sousa 2017, 83). 49 Trecho retirado ipsis verbis da Tabela 5. Princípios de design da Experiência de Utilização (Sousa 2017, 83). 87 Figura 2.29: Exemplo de Relação esforço/recompensa no RPG Maker MV (2015). Fonte: https://youtu.be/IR9y6vco-VQ?t=163, timecode 00:02:43:00, em 21/06//2021. A razão entre o esforço necessário para realizar uma tarefa e a sua recompensa tem impacto direto no interator. Reduzir os esforços e maximizar as recompensas auxilia a concretizar tarefas na ferramenta de autoria. A relação esforço/recompensa influencia o interator e tem potencial para tornar a sua experiência mais agradável. 2.3.4 Padrões de Design Dos princípios do design, podemos observar os padrões de design que emergem da sua implementação. Entendemos os padrões como soluções para problemas específicos, orientados a objetos no design de software, que consistem numa descrição clara do problema, da solução e da aplicação. (Sousa, 2017, 60). Tidwell (2006) classifica padrões de design de interação como características estruturais e comportamentais que aprimoram a “habitabilidade” e podem tornar as coisas mais fáceis, belas, úteis e utilizáveis. Em essência, os padrões são características estruturais e comportamentais que aprimoram a “habitabilidade” de alguma coisa - uma interface de utilizador, um website, um programa orientado a objetos ou mesmo uma construção. Eles tornam as coisas mais fáceis de entender ou mais bonitas; eles tornam as ferramentas mais úteis e utilizáveis. 50 (Tidwell 2006, xiv) Com isto em mente, procuramos padrões de design, com características comportamentais e estruturais, que foram identificados nos resultados dos levantamentos das ferramentas de autoria (Secção 2.2.4) e outros padrões encontrados na pesquisa bibliográfica e possam oferecer contributos à ferramenta de autoria. 50 T.A.:"In essence, patterns are structural and behavioral features that improve the “habitability” of something - a user interface, a website, an object-oriented program, or even a building. They make things easier to understand or more beautiful; they make tools more useful and usable.” (Tidwell 2006, xiv) 88 Na Tabela 2.5, abaixo, realizamos um sumário dos padrões de design relacionando-os com os princípios de design. Podemos assim perceber como cada princípio do design, observado neste estudo, se converte em padrões de interação e interface para o interator. Tabela 2.5: Levantamento dos principais padrões de Design. Padrão de Design Descrição Princípios do Design Barra de Ferramentas com botões de ícones A barra de ferramentas fornece acesso rápido as ferramentas usadas com frequência e devem ser reconhecidas rapidamente. Pictogramas tem um melhor potencial para exercer esta função do que textos (Cooper et al. 2014). Ferramentas ao alcance da mão; Manipulação direta sem ter de pedir permissão; Boa forma; Caracterização; Canvas mais Paleta Canvas mais Paleta é composto por uma área de vazia a ser usada como canvas e uma paleta, ao lado, com uma grelha de botões, com ícones, texto ou ambos (Tidwell 2006). Ferramentas ao alcance da mão; Manipulação direta sem ter de pedir permissão; Hierarquia; Construção Incremental Construção Incremental consiste em facilitar a construção por partes pequenas e responsivas a mudanças rápidas e guardar alterações. Feedback é crítico, deve-se mostrar ao interator o resultado do trabalho constantemente (Tidwell, 2006). Manipulação direta sem ter de pedir permissão; Causa-efeito; Relação esforço/recompensa Drag and Drop O Drag and Drop (arraste e solte) é uma forma simples de manipular os arquivos na área de trabalho do interator (Scott e Niel, 2009). O drag and drop pode ser usado para posicionar diretamente um objeto no ecrã, alterar as relações entre objetos, evocar uma ação no objeto arrastado, entre outros. Ferramentas ao alcance da mão; Manipulação direta sem ter de pedir permissão; Causa-efeito; Relação esforço/recompensa Exploração Segura Explorar uma interface sem sofrer consequências graves, é provável que se aprenda mais. Um software eficiente permite que o interator experimente, volte atrás, e tente outro caminho (Tidwell 2006). Prevenção de erros ou tolerância; Ferramentas Contextuais Podemos agrupar as ferramentas em barras de ferramentas e menus para ajudar a organizar as funcionalidades da aplicação, entretanto, isso pode agir contra a Lei de Fitts. Em alternativa, podemos usar Ferramentas Contextuais para trazer as funcionalidades para o conteúdo (Scott e Niel, 2009). Ferramentas ao alcance da mão; Restrição de âmbito Gratificação Instantânea Se o interator utiliza uma aplicação e consegue uma experiência positiva no primeiro contacto, provavelmente irá continuar a usála, mesmo que se torne mais difícil depois (Tidwell 2006). Afinidade; Relação esforço/recompensa; Painéis Fechados Painéis Fechados podem organizar as secções de conteúdo em painéis separados e permitir o interator interagir com os painéis separadamente (Tidwell 2006). Predefinição; Restrição de âmbito; 89 Painel de Tarefas Painel de tarefas, ou sidebar, é um padrão comumente aplicado a áreas de propriedades dedicadas, não somente nas laterais, mas também abaixo da área de trabalho (Cooper et al. 2014). Hierarquia; Restrição de âmbito; Manipulação direta sem ter de pedir permissão; Palco Central Palco Central consiste em posicionar o elemento principal na maior subseção da interface do interator. As ferramentas e conteúdos secundários ficam agrupados em painéis menores (Tidwell 2006). Hierarquia; Restrição de âmbito; Manipulação direta sem ter de pedir permissão; Pré-Visualização Exibir aos interatores uma simulação dos resultados da ação (Tidwell 2006). Prevenção de erros ou tolerância; Causa-efeito Pilha de Cartas O arranjo das seções de conteúdo em painéis separados, empilhálos e exibi-los apenas um por vez (Tidwell 2006). Hierarquia; Restrição de âmbito; Repetição Simplificada A Repetição Simplificada diz que quando possível reduzir a repetição das operações a um toque no teclado ou clique, o interator será poupado do tédio (Tidwell 2006). Predefinição; Prevenção de erros ou tolerância Visualização Alternativa Uma aplicação pode conter Visualizações Alternativas, outros modos de visualização estruturalmente diferente do padrão (Tidwell 2006). Prevenção de erros ou tolerância. Wizard Wizard é um padrão usado para conduzir o interator através de um processo, passo a passo, pela interface (Tidwell 2006). Hierarquia; Restrição de âmbito; Manipulação direta sem ter de pedir permissão; Entre os padrões que Tidwell (2006) classifica como padrões comportamentais, destacamos os padrões de exploração segura, gratificação instantânea, construção incremental e repetição incrementada. Devemos ressaltar que não descartamos padrões, mas reconhecemos quais são os de mais-valia para o contexto deste estudo. Ao criar algo nos sistemas levantados, o interator normalmente não o faz de uma vez. Fá-lo em pequenas partes, passo a passo, progredindo e regredindo, de diversas formas. Uma interface builderstyle 51 precisa de suportar este tipo de trabalho. Construção Incremental consiste em facilitar a construção em pequenas partes e responsivas a mudanças rápidas e guardar alterações. O feedback é crítico pelo que se deve mostrar constantemente ao interator o resultado do trabalho (Tidwell 2006). Todo o processo de criação numa ferramenta de autoria pode levar demasiado tempo. O interator deve sentir-se confortável em regressar ao processo quando puder e continuar de onde parou sem perdas de informações. O Twine (2009) faz uso deste padrão de design ao dividir os eventos da narrativa em blocos de texto separados e ligados por hiperligação. Na área de trabalho do sistema, o interator pode visualizar a representação destes blocos em e ligação entre eles. 51 T.A.: Estilo construtor. 96 Os sistemas levantados lidam com processos custosos ao interator. Por esta razão, os sistemas permitem ao interator visualizar uma simulação do resultado. Pré-Visualização consiste em exibir aos interatores uma simulação dos resultados da ação (Tidwell 2006). Pré-visualizações ajudam a evitar erros que consumam muito tempo ou recurso do sistema. Mostrar um resumo ou descrição visual do que está prestes a acontecer, dá ao interator a oportunidade de voltar e corrigir-se. Se o interator gostar da pré-visualização, pode seguir. Contudo, se o resultado não agradar, ainda há tempo de corrigir o que deseja. O sistema inklewriter free (2011) permite que o interator veja uma simulação do resultado final ao clicar no botão “read” (Figura 2.40.a). O sistema alterna para a interface de pré-visualização e mostra o resultado do ponto de vista do interator final da narrativa (Figura 2.40.b). Figura 2.40: Uso do padrão de Pré-Visualização no inklewriter free (2011). Para permitir uma criação mais intuitiva, alguns dos sistemas levantados possibilitam a manipulação de elementos através do clique e arraste no ecrã. O Drag and Drop (arraste e solte) é uma forma simples de manipular os arquivos na área de trabalho do interator (Scott e Niel, 2009). O drag and drop pode ser usado para posicionar diretamente um objeto no ecrã, alterar as relações entre objetos, evocar uma ação no objeto arrastado, entre outros. Este padrão pode requerer algumas considerações na representação visual para evidenciar a alteração. O drag and drop dá ao interator a sensação de causa e efeito das suas ações e a visualização rápida dos resultados. Este recurso pode ser útil em ferramentas de autoria por conectar a ação no mundo real com a ação no mundo virtual, isto pode trazer benefícios no aprendizado do uso das ferramentas para a criação. 97 Figura 2.41: Uso do drag and drop no Mario Maker (2015). Fonte: https://www.nintendo.pt/Jogos/Wii-U/Super-Mario-Maker-892704.html, em 18/06/2021. Como forma de organizar os conteúdos no ecrã, alguns sistemas levantados optam por dividilos em abas, como, por exemplo, em painéis de tarefas. A Pilha de Cartas consiste no arranjo das seções de conteúdo em painéis separados, empilhá-los e exibi-los apenas um por vez (Tidwell 2006). Esta forma de arranjo apresenta uma solução para casos onde há muitos painéis e controlos disponíveis num sistema. Reservar um espaço fixo na interface para apresentá-los e dividi-los em abas, por exemplo, pode resolver problemas de excesso de informações e o arranjo de funcionalidades na interface. Figura 2.42: Uso do padrão Pilha de Cartas em forma de abas no Storaway.io (2019). 98 2.3.5 Discussão Os levantamentos dos princípios e padrões de design ajudam-nos a esclarecer quais as soluções de design são as mais utilizadas nos sistemas levantados. Esta perceção guia-nos para encontrar formas de conceber uma ferramenta de autoria eficaz no design de narrativas interativas. Com os levantamentos dos princípios de design, quantificamos os levantamentos de ocorrências dos princípios de Design Interação (Figura 2.43). Desta forma, percebemos a relevância destes princípios e o impacto que podem ter na ferramenta de autoria. Ressaltamos que devido às particularidades na manifestação do princípio de Predefinições, dividimos os levantamentos em duas categorias: 1) Predefinições – automatização de processos; 2) Predefinições – parâmetros previamente estabelecidos. Figura 2.43: Ocorrências dos princípios de design Interação. O alto número de ocorrências dos princípios Ferramentas ao alcance da mão e Manipulação sem ter de pedir permissão, 100% dos sistemas, esclarece-nos que implementar estes princípios na ferramenta de autoria é crítico. O princípio de Predefinições tem particularidades na sua implementação. Todos os sistemas apresentam alguma forma de uso deste princípio, alguns apresentam ambas. O uso deste princípio é relevante a ferramenta, entretanto é preciso conceber as formas de uso do princípio para a ferramenta. Em seguida, quantificamos os levantamentos de ocorrências dos princípios de design Arquitetura da Informação (Figura 2.44). Desta forma, percebemos a relevância destes princípios e o impacto que podem ter na ferramenta de autoria. Ressaltamos que devido às particulares na manifestação do princípio de Prevenção dos erros ou tolerância, dividimos os levantamentos em três 99 categorias: 1) Prevenção dos erros - Prevenção; 2) Prevenção dos erros – Proteção; 3) Prevenção dos erros – Informações. Figura 2.44: Ocorrências dos princípios de design Arquitetura da Informações. Os princípios de Hierarquia e Restrição de âmbito mostraram-se os mais críticos nas análises. O princípio de Prevenção de erros tem muitas formas de manifestação, pelo que concluímos que a sua implementação se pode dar de diferentes formas, separadas ou em conjunto. No gráfico seguinte, quantificamos as ocorrências dos princípios de design da Experiência de Utilização (Figura 2.45). Desta forma, percebemos a relevância destes princípios e o impacto que podem ter na ferramenta de autoria. Figura 2.45: Ocorrências dos princípios de design Experiência de Utilização O princípio de Causa-efeito mostrou ser o mais relevante em ferramentas de autoria, sendo usado por todos os sistemas levantados. O princípio de Afinidade ocorre em grande parte dos sistemas, 100 em 10 dos 12 sistemas. O princípio de Relação recompensa/esforço é o menos encontrado nos levantamentos. Esta relação não é sempre estabelecida em sistemas mais custosos ao interator. Para os padrões de design, os levantamentos foram divididos entre dois grupos e as suas ocorrências reunidas em tabelas e quantificadas em gráficos. Um grupo que se relaciona com ações, comandos e formas de interagir com o sistema, nomeados de estratégias de interação. Outro grupo para as ocorrências que se relacionam com arranjos de informações na interface do sistema, nomeados como estruturas de interface. A Tabela 2.6 relaciona os padrões de interação e a sua utilização em cada uma das ferramentas levantadas. A Figura 2.46 quantifica as ocorrências de cada estratégia. Observamos o alto índice de uso dos padrões Construção Incremental e Gratificação Instantânea, seguidos do padrão Pré-Visualização. Estes são padrões mais comuns em razão das necessidades de feedback visual durante a criação e o custo de tempo envolvido. A Pré-Visualização, embora não tão crítica, traz grandes vantagens na prevenção de erros, o que a torna uma funcionalidade crítica. Como nem toda a ferramenta de autoria tem o seu processo de criação rigorosamente estruturado, observamos pouca ocorrência do padrão Wizard. Este padrão tem o objetivo de auxiliar a construção incremental e evitar confusão, mas pode restringir o fluxo de criação do interator. Tabela 2.6: Levantamento dos padrões para Estratégias de Interação. Construção Incremental Drag and Drop Gratificação Instantânea PréVisualização Repetição Simplificada Visualização Alternativa Wizard articy:draft 3 ✓ ✓ ✓ ✓ ✓ ✓ Eko Studio ✓ ✓ ✓ ✓ Inklerwriter free ✓ ✓ ✓ Mario Paint ✓ ✓ RPG Maker MV ✓ ✓ ✓ ✓ ✓ ✓ Stonaway.io ✓ ✓ ✓ Story Speaker ✓ ✓ ✓ ✓ StoryMapJS ✓ ✓ ✓ StoryPlaces ✓ ✓ ✓ ✓ 101 Super Mario Maker 1 e 2 ✓ ✓ ✓ ✓ ✓ The Adventures of Batman & Robin - Cartoon Maker ✓ ✓ ✓ ✓ Twine ✓ ✓ ✓ Figura 2.46: Ocorrências das Estratégias de Design de Interação. Nas interfaces das ferramentas, observamos todas as ferramentas de autoria estruturarem-se com base no padrão de Palco Central (Figura 2.47). A interface de uma ferramenta de autoria privilegia a área de trabalho e todos os outros elementos devem ser organizados em função desta área. Para este fim, percebemos o uso frequente de padrões como a Barra de Ferramentas com Botões de Ícones, Canvas mais Paleta, Painel de Tarefas, e Pilha de Cartas. Painéis Fechados e Menus Contextuais também auxiliam o arranjo de informações, mas aparecem em menor número nas ferramentas analisadas. 102 Tabela 2.7: Levantamento de padrões para Estrutura de Interface. Barra de Ferramentas com botões de ícones Canvas mais Paleta Ferramentas Contextuais Painéis Fechados Painel de Tarefas Palco Central Pilha de Cartas articy:draft 3 ✓ ✓ ✓ ✓ ✓ ✓ Eko Studio ✓ ✓ ✓ ✓ ✓ ✓ Inklerwriter free ✓ ✓ ✓ ✓ ✓ Mario Paint ✓ ✓ ✓ RPG Maker MV ✓ ✓ ✓ ✓ ✓ ✓ Stonaway.io ✓ ✓ ✓ ✓ ✓ Story Speaker ✓ ✓ ✓ ✓ StoryMapJS ✓ ✓ StoryPlaces ✓ ✓ ✓ Super Mario Maker 1 e 2 ✓ ✓ ✓ ✓ ✓ ✓ The Adventures of Batman & Robin - Cartoon Maker ✓ ✓ ✓ ✓ Twine ✓ ✓ ✓ ✓ ✓ 103 Figura 2.47: Ocorrências das Estruturas de Design de Interface. As estratégias de interação para o design de narrativas interativas devem abranger princípios e padrões do design que auxiliem o processo de autoria. A ferramenta de autoria deve considerar a forma como o interator utiliza os recursos disponíveis, pois esta relação tem influência direta no resultado da autoria. Para melhor entendermos as estratégias de design de interação devemos observar cenários do seu uso. Análises de casos de estudo podem esclarecer-nos soluções práticas para o design numa ferramenta de autoria focada no design de narrativas interativas. 2.4 Um levantamento dos tipos de estrutura narrativa possíveis na amostra Cada um dos sistemas levantados lidam com a criação de narrativas interativas de forma particular. Alguns dos sistemas são mais complexos do que outros, apresentam mais funcionalidades e permitem um número mais diverso de estruturas de narrativas. Procuramos nestes sistemas levantar quais estruturas de narrativa interativas (Secção 1.2) são possíveis de serem concebidas. 104 Tabela 2.8: Tipos de estrutura narrativa possíveis nos sistemas articy:draft 3 O sistema articy:draft 3 ( 2017) desenvolve as suas narrativas num sistema de nós e grafos que se relacionam de diversas formas. As estruturas de narrativas que são concebidas que necessitem apenas de ramificações para existir são possíveis de serem concebidas no sistema. Estruturas como: The complete graph: The network; The tree; The vector with side branches; The maze; The directed network; The linear plots; The Branching plots; e The foldback plot. Estas estruturas de narrativas são possíveis com ajustes dos grafos entre os nós na construção de narrativa no sistema. O interator tem liberdade para formar arranjos de diversos níveis de complexidades, tornando estas estruturas possíveis. O sistema tem uma particularidade, os nós do sistema, nomeados fragmentos, podem conter outros nós. Isto permite criar subnarrativas dentro de cada evento de uma narrativa. Esta funcionalidade torna possível a construção da estrutura The action space, epic wandering and story-world descrita por Ryan (2011) e a The Main Plot with Subplots descrita por Adams (2011). Eko Studio O Eko Studio (2010) é um sistema que cria narrativas através de uma representação de nós e grafos que se relacionam de diversas formas. As estruturas que requerem uma organização dos nós e grafos são mais facilmente construídas dentro do sistema. Estruturas como: The complete graph: The network; The tree; The vector with side branches; The maze; The directed network; The linear plots; The Branching plots; The foldback plot; The action space, epic wandering and story-world; e The Main Plot with Subplots, podem ser concebidas no sistema através da organização dos nós e os seus grafos. O Eko Studio (2010) possui a funcionalidade de criar nós paralelos. Esta funcionalidade permite que dois ou mais eventos existam em simultâneo, na narrativa, permitindo retratar um evento de perspetivas diferentes. Esta funcionalidade torna possível a construção da estrutura The braided plot. Inklewriter free O inklewriter free (2011) é um sistema que cria narrativas através de blocos de textos interligados que podem relacionar-se de diversas formas. As estruturas que requerem ligações diretas ou ramificadas entre os blocos são mais facilmente construídas dentro do sistema. Estruturas como: The complete graph: The network; The tree; The vector with side branches; The maze; The directed network; The linear plots; The Branching plots; The foldback plot; The action space, epic wandering and story-world; e The Main Plot with Subplots, podem ser concebidas dentro do sistema através da organização dos blocos de texto. O sistema permite tornar que alguns dados dos eventos sejam gerados aleatoriamente por um banco de dados. Esta funcionalidade do sistema permite ao interator, ao menos em alguns momentos, criar a estrutura The Hybrid System descrita por Adams (2012). Mario Paint O jogo Mario Paint (1992) é um sistema que permite narrativas de estruturas simples e lineares. Nos modos Música e Animação, o interator desenvolve narrativas não-ergódicas, sendo experienciadas da mesma maneira por todos os interatores. Com isto em mente, o jogo permite apenas a estrutura de narrativa The Linear Plot descrito por Adams (2011). RPG Maker MV O sistema RPG Maker MV (2015) desenvolve as suas narrativas num sistema de cenários de um jogo onde dentro destes cenários pode haver diversos eventos que se ligam através de diálogos, desafios entre outros. As estruturas de narrativas que são concebidas que necessitem apenas de ramificações para existir são possíveis de serem concebidas no sistema. Estruturas como: The complete graph: The network; The tree; The vector with side branches; The maze; The directed network; The linear plots; The Branching plots; The foldback plot. O interator pode criar subnarrativas para cada evento da narrativa. Isto permite conceber a estrutura de The action space, epic wandering and story-world descrita por Ryan (2011) e a The Main Plot with Subplots descrita por Adams (2011). No sistema, um mesmo evento pode existir em diversos pontos da estrutura da narrativa. Isso permite que o interator crie narrativas com diferentes perspetivas sobre o mesmo evento, permitindo conceber a estrutura The braided plot. O sistema também permite ao interator desenvolver narrativas ergódicas que permitam o jogador descobrir novos eventos ao longo da sua travessia. Isto possibilita a construção da estrutura The Hidden Story descrita por Ryan (2011). O sistema permite criar alguns eventos da narrativa de forma aleatória, utilizando banco de dados de eventos, o que possibilita a estrutura The Hybrid System, descrita por Adams (2021) Stonaway.io O Stornaway.io (2019) é um sistema que cria narrativas através de uma representação de nós e grafos que se relacionam de diversas formas. As estruturas que requerem uma organização dos nós e grafos são mais facilmente construídas no sistema. Estruturas como: The complete graph: The network; The tree; The vector with side branches; The maze; The directed network; The linear plots; The Branching plots; e The foldback plot; enquadram-se neste tipo estrutura de narrativa interativa. O sistema possui a funcionalidade de variar o conteúdo de um evento de acordo com as ligações. 105 Por exemplo, se o interator atravessa até um evento pelo caminho A, têm acesso a um conteúdo, se atravessar até o mesmo evento pelo caminho B, têm acesso a outro conteúdo. Esta funcionalidade torna possível a construção da estrutura The braided plot. Story Speaker O Story Speaker (2017) permite criar narrativa com estruturas de fluxo direcionado. Os eventos podem ramificar em diferentes vertentes, entretanto tendem a direcionar para o final da narrativa, com pouco possibilidade de explorar ramificações paralelas ou regredir na narrativa. Estruturas como: The tree; The vector with side branches; The directed network; The linear plots; The Branching plots; e The foldback plot, podem ser concebidas no sistema. StoryMapJS O StoryMapJS (2017) é um sistema que permite narrativas com estruturas simples e lineares. A narrativa no sistema tem um fluxo fixo de vivenciar as experiências. Por esta razão, a única estrutura possível no sistema é a The Linear Plot descrita por Adams (2012). StoryPlaces O StoryPlaces (2015) é um sistema que permite narrativa com eventos ligados entre si a partir de restrições como gatilhos de ativação. Cada evento é acessado após o interator atingir os requisitos previamente determinados. Este tipo de sistema permite a criação de estruturas como: The complete graph: The network; The tree; The vector with side branches; The maze; The directed network; The linear plots; The Branching plots; e The foldback plot. Super Mario Maker 1 e 2 Os jogos Super Mario Maker 1 (2015) e Super Mario Maker 2 (2019) permitem criar narrativa com estruturas de fluxo direcionado. Os eventos podem ramificar em diferentes vertentes, entretanto tendem a direcionar para o mesmo final da narrativa, com pouco possibilidade de explorar ramificações paralelas ou regredir na narrativa. Estruturas como: The vector with side branches; The directed network; The linear plots; The Branching plots; e The foldback plot, podem ser concebidas no sistema. The Adventures of Batman & Robin - Cartoon Maker O The Adventures of Batman & RobinCartoon Maker (1995) é um sistema que permite narrativas com estruturas simples e lineares. As narrativas no sistema tem um fluxo fixo de vivenciar as experiências. Por esta razão, a única estrutura possível no sistema é a The Linear Plot descrita por Adams (2012). Twine O Twine (2009) é um sistema que cria narrativas através de uma representação de nós e grafos que se relacionam de diversas formas. As estruturas que requerem uma organização dos nós e grafos são mais facilmente construídas no sistema. Estruturas como: The complete graph: The network; The tree; The vector with side branches; The maze; The directed network; The linear plots; The Branching plots; The foldback plot; The action space, epic wandering and storyworld; e The Main Plot with Subplots, podem ser concebidas dentro do sistema através da organização dos nós e os seus grafos. O sistema permite tornar que alguns dados dos eventos sejam gerados aleatoriamente. O sistema permite recursos para determinar o banco de dados com as informações guardadas e os pontos da narrativa que devem receber uma informação contida neste banco de dados de forma aleatória. Esta funcionalidade do sistema permite ao interator, ao menos em alguns momentos, criar a estrutura The Hybrid System descrita por Adams (2012). Após levantar as estruturas de narrativas possíveis nos sistemas analisados (Tabela 2.8), apresentamos os resultados na Tabela 2.9 e quantificamos as ocorrências na Figura 2.48, mostrados abaixo. 112 Tabela 2.12: Levantamento dos níveis de agência nos sistemas. articy:draft 3 No sistema articy:draft 3 (2014) permite construir narrativas que equilibrem as possibilidades do sistema com as possibilidades da narrativa. Isto significa que as funcionalidades do sistema permitem construir narrativas com estruturas complexas e dar ao interator a sensação de que as suas escolhas têm efeito e personalizam a sua experiência. Entretanto, como o sistema tem muitas possibilidades de interação, se essas interações não estiverem em harmonia com a narrativa hardcoded, o interator pode perder a sensação de agência sobre a narrativa. Eko Studio As possibilidades de interação no sistema Eko Studio (2010) são limitadas em comparação a outros sistemas levantados. Entretanto, a sensação de agência pode ser alcançada através desta simplicidade. As narrativas no sistema são baseadas em vídeos e com consequências diretas das escolhas disponíveis. Isto permite que as escolhas apresentadas pela narrativa se equilibrem com as possibilidades do sistema. Inklewriter free O sistema inklewriter free (2011) permite atingir a sensação de agências através de escolhas diretas entre as possibilidades da narrativa e as possibilidades do sistema. Os eventos da narrativa ramificam-se de forma direta, evidenciando a causa e a consequência de cada escolha feita no sistema. As escolhas do interator também podem influenciar de forma indireta na narrativa, através de marcadores, que resultem em consequências que não estão ligadas às escolhas visivelmente disponíveis. Isto permite que as escolhas apresentadas pela narrativa se equilibrem com as possibilidades do sistema, gerando a sensação de agência no interator. Mario Paint O sistema Mario Paint (1992) não permite causar a sensação de agência no interator. As possibilidades narrativas são lineares e o interator tem um papel de espectador. Apesar de ser um sistema com muita interatividade, as ações dos interator não alteram os eventos da narrativa e as suas ações não têm consequências relevantes. RPG Maker MV O RPG Maker MV (2015) é um dos sistemas mais complexos levantados e permite conceber a sensação de agência de diversas formas. O sistema foi desenvolvido para construir narrativas complexas e oferece muita interatividade e ações ao interator. Com esta complexidade, as possibilidades do sistema tem alcance de equiparar-se com as possibilidades de narrativa bem estruturadas. As ações do interator podem ter influência nas escolhas diretas ou em contextos mais subjetivos da narrativa. Entretanto, é preciso ressaltar que o alto nível de interatividade pode desequilibrar a agência do interator, pois, sem uma narrativa que acompanhe a complexidade do sistema, perde-se a sensação de agência Stonaway.io A sensação de agência pode ser alcançada, no sistema Stornaway.io (2019), através de uma relação direta entre as possibilidades do sistema e as possibilidades da narrativa. As narrativas no sistema são baseadas em vídeos e com consequências diretas das escolhas disponíveis. Esta relação entre o sistema e a narrativa permite um equilíbrio entre as ações e as consequências que satisfaçam a sensação de agência do interator. Story Speaker O sistema Story Speaker (2017) permite atingir a sensação de agências através de escolhas diretas entre as possibilidades da narrativa e as possibilidades do sistema. Os eventos da narrativa ramificam-se de forma simples e direta, tornando evidente a causa e a consequência 113 de cada escolha feita no sistema. Isto permite que as escolhas apresentadas pela narrativa se equilibrem com as possibilidades do sistema, gerando a sensação de agência no interator. StoryMapJS O sistema StoryMapJS (2017) não permite causar a sensação de agência no interator. As possibilidades narrativas são lineares e o interator tem um papel de espectador. As ações dos interator não alteram os eventos da narrativa e suas ações não tem consequências relevantes. StoryPlaces O sistema StoryPlaces (2015) pretende atingir a sensação de agência através de consequências indiretas entre as possibilidades da narrativa e as possibilidades do sistema. Os eventos da narrativa surgem para o interator visto que este alcance os requisitos necessários. Isto permite que a ação do interator altere a narrativa, entretanto as consequências das ações ocorram de forma indireta. O interator pode ter dificuldades em perceber como a sua ação influencia a narrativa e não se estabelece a sensação de agência. Super Mario Maker 1 e 2 Os sistemas Super Mario Maker 1 (2015) e Super Mario Maker 2 (2019) estabelecem a sensação de agência de forma direta entre ação e consequência. O equilíbrio entre as possibilidades da narrativa e do sistema. Os sistemas permitem escolhas simples para o interator, entretanto essas escolhas podem alterar os caminhos percorridos num cenário e a forma de vencer os desafios. The Adventures of Batman & Robin - Cartoon Maker O sistema The Adventures of Batman & Robin - Cartoon Maker (1995) não permite causar a sensação de agência no interator. As possibilidades narrativas são lineares e o interator tem um papel de espectador. Apesar de ser um sistema com muita interatividade, as ações dos interator não alteram os eventos da narrativa e suas ações não têm consequências relevantes. Twine O sistema Twine (2011) permite atingir a sensação de agências através de escolhas diretas entre as possibilidades da narrativa e as possibilidades do sistema. Os eventos da narrativa ramificamse de forma direta, evidenciando a causa e a consequência de cada escolha feita no sistema. As escolhas do interator também podem influenciar de forma indireta na narrativa, através de variáveis do sistema, que resultem em consequências que não estão ligadas às escolhas visivelmente disponíveis. Isto permite que as escolhas apresentadas pela narrativa se equilibrem com as possibilidades do sistema, gerando a sensação de agência no interator. Após observarmos como a agência é concebida nos sistemas analisados (Tabela 2.12), apresentamos os resultados na Tabela 2.13 e quantificamos as ocorrências na Figura 2.50, mostrados abaixo. 114 Tabela 2.13: Levantamento das possibilidades de agência nos sistemas. Agência inexistente Agência direta Agência indireta articy:draft 3 ✓ ✓ Eko Studio ✓ inklerwriter free ✓ ✓ Mario Paint ✓ RPG Maker MV ✓ ✓ Stonaway.io ✓ ✓ Story Speaker ✓ StoryMapJS ✓ StoryPlaces ✓ Super Mario Maker ✓ The Adventures of Batman & Robin - Cartoon Maker ✓ Twine ✓ ✓ 115 Figura 2.50: Ocorrências das possibilidades de agências nos sistemas Observamos que a maioria dos sistemas visa criar a sensação de autoria através de uma relação direta entre ação e consequência. As possibilidades da narrativa e as possibilidades do sistema se equilibram de uma forma visível ao interator. Alguns sistemas procuram dar agência ao interator de forma indireta. As consequências das ações do interator não surgem no instante em que a ação é feita ou não vem de forma explícita. O interator sente que suas ações têm consequência, mas não pode prever a extensão destas consequências enquanto age. Os sistemas Mario Paint (1992), The Adventures of Batman & Robin - Cartoon Maker (1995) e StoryMapJS (2017) não permitem a agência do interator sobre a narrativa. 2.7 Um levantamento dos tipos de travessia ergódica ocorrentes na amostra Alguns dos sistemas levantados permitem construir narrativas interativas com travessias ergódicas de diversos tipos. O mesmo sistema é capaz de construir diversos tipos de travessias, seja um único tipo para a narrativa toda ou a combinação entre eles. Procuramos relacionar os sistemas levantados os tipos de travessias ergódicas (Secção 1.5.3). Tabela 2.14: Levantamento das travessias nos sistemas. articy:draft 3 O sistema articy:draft 3 (2014) permite a construção de narrativas do tipo Branching, Bending e Reprising diretamente da área de trabalho com ajustes nos nó e grafos. Através de configurações específicas, é possível criar actores para a narrativa, nomeadas entidades, constituírem um tecido social e possibilitar a travessia de Modulating. Com o uso de configurações avançadas de programação, o sistema permite conceber a travessias de Profiling. Eko Studio O sistema Eko Studio (2010) permite a construção das travessias de Branching e Bending com o arranjo dos nós e grafos na área de trabalho. O uso da funcionalidade de nós paralelos57, é possível conceber a travessias de Reprising. Inklewriter free O sistema Inklewriter free (2011) permite conceber as travessias de Branching e Bending diretamente da área de trabalho. Com a funcionalidade condicional, é possível construir eventos com elementos gerados aleatoriamente, contribuindo com a travessia Reprising. Os marcadores nos eventos da narrativa podem contribuir para a construção da travessia Profiling. Mario Paint O jogo Mario Paint (1992) não pode conceber nem uma das travessias ergódicas, pois, somente permite a autoria de narrativas lineares não-ergódicas no sistema. 57 T.A: Parallel Nodes. 116 RPG Maker MV O RPG Maker MV (2015) pode conceber todas as narrativas levantadas neste estudo (Secção 1.5.3). A construção das travessias requer funcionalidades específicas no sistema. Escolhas, diálogos e a exploração mundo do jogo pode construir a travessia de Branching. A travessia de Bending pode ser concebida com a exploração do mundo do jogo. O sistema permite conceber um tecido social para a narrativa no sistema, isso possibilita a travessia de Modulating. As narrativas no sistema podem permitir ao interator configurar o seu próprio avatar, a partida ou durante o progresso da narrativa. Esta funcionalidade permite a construção da travessia Profiling. As funcionalidades que permitem variáveis no sistema e a exploração do mundo do jogo possibilitam a construção das travessias Reprising. Stonaway.io O sistema Stornaway (2019) permite a construção das travessias de Branching e Bending com o arranjo dos nós e grafos na área de trabalho. A possibilidade de atribuir mais de um conteúdo num único nó, cada um com requisitos diferentes de ativação, torna possível conceber a travessias de Reprising. Story Speaker As narrativas construídas no sistema Story Speaker (2017) apresentam estruturas simples. As travessias possíveis de serem concebidas são as de Branching e Bending. StoryMapJS O sistema StoryMapJS (2017) não pode conceber nem uma das travessias ergódicas, pois, somente permite a autoria de narrativas lineares não-ergódicas no sistema. StoryPlaces O StoryPlaces (2015) permite a construção de narrativas com travessias do tipo Bending. Através da funcionalidade de programação dentro do sistema, é possível construir as travessias de Reprising e Modulating. Super Mario Maker 1 e 2 Os jogos Super Mario Maker 1 (2015) e Super Mario Maker 1 (2019) permitem a construção das travessias de Branching, Bending e Reprising. As narrativas concebidas no sistema permitem esses tipos de travessias através da exploração do mundo do jogo. The Adventures of Batman & Robin - Cartoon Maker O jogo The Adventures of Batman & Robin - Cartoon Maker (1995) não pode conceber nem uma das travessias ergódicas, pois, somente permite a autoria de narrativas lineares nãoergódicas no sistema. Twine O sistema Eko Studio (2010) permite a construção das travessias de Branching e Bending com o arranjo dos nós e grafos na área de trabalho. Com o uso das funcionalidades de programação, o interator pode construir as travessias de Modulating, Profiling e Reprising. Após observarmos as possíveis travessias nos sistemas analisados (Tabela 2.14), apresentamos os resultados na Tabela 2.15 e quantificamos as ocorrências na Figura 2.51, mostrados abaixo. 117 Tabela 2.15: Levantamento das travessias nos sistemas. Branching Bending Modulating Profiling Reprising articy:draft 3 ✓ ✓ ✓ ✓ ✓ Eko Studio ✓ ✓ ✓ inklerwriter free ✓ ✓ ✓ ✓ Mario Paint RPG Maker MV ✓ ✓ ✓ ✓ ✓ Stonaway.io ✓ ✓ ✓ Story Speaker ✓ ✓ StoryMapJS StoryPlaces ✓ ✓ Super Mario Maker ✓ ✓ ✓ The Adventures of Batman & Robin - Cartoon Maker Twine ✓ ✓ ✓ ✓ ✓ Figura 2.51: Ocorrências das travessias nos sistemas 118 Observamos que as travessias de Bending e Reprising são as travessias com maiores ocorrências entre os sistemas levantados. Os sistemas Mario Paint (1992), The Adventures of Batman & Robin - Cartoon Maker (1995) e StoryMapJS (2017) não permitem a criação de travessias ergódicas. Suas narrativas têm estruturas lineares (Secção 2.4), participação periférica (Secção 2.5) e agência inexistente (Secção 2.6), o que inibe as travessias ergódicas levantadas neste estudo. Poucos sistemas permitem a criação de um tecido social dentro do mundo virtual, por esta razão, as travessias de Modulating têm menor ocorrência nos sistemas levantados. 2.8 Sumário Ao analisar as diferentes aplicações, observamos sistemas focados na autoria, com área de trabalho bem definida e ferramentas representadas de forma direta com botões e ícones. Cada sistema propõe diferentes soluções para o uso de recursos avançados e para complexidade na sua interface. Todas as aplicações aqui descritas constituem uma área de trabalho bem definida, barras ferramentas e um painel de tarefas e/ou biblioteca. Os videojogos desenvolvem as dinâmicas de criação, ao que entendemos neste estudo, de duas formas: criação livre e criação pré-estruturada. A criação livre pode ser entendida como o videojogo que oferece ferramentas criativas e permite ao interator desenvolver livremente a sua ideia num canvas, como por exemplo do modo Arte do Mario Paint (1992) e os seus recursos de desenho livre. A criação previamente estruturada pode ser entendida quando o videojogo oferece uma seleção de elementos e o interator pode desenvolver a sua ideia através do uso destes elementos, como é exemplo editor de fases em Super Mario Maker (2015). Ao observar os jogos, percebe-se que a forma de criação livre possui pouca barreira de aprendizado e com interface simples. As ferramentas são facilmente encontradas na interface e tem as suas funções facilmente percebidas pelo interator. A liberdade oferecida permite testar rapidamente os recursos disponíveis e iniciar uma criação própria. A criação preestabelecida também possui pouca barreira de aprendizado, no entanto, as suas criações são limitadas pelos recursos disponíveis, a sua interface tende a ser um pouco mais complexa ao dividir muitos recursos em secções. O ponto forte está na qualidade gráfica e sonora dos elementos disponíveis. Os levantamentos dos princípios de design esclareceram quais princípios críticos para a construção de uma ferramenta de autoria. Entre os princípios do design de interação levantados foram os de Ferramentas ao alcance da mão, Manipulação direta sem ter de pedir permissão e Predefinições. O princípio de Predefinições apresentou duas formas de manifestação entre os sistemas, a de automatização de processos e parâmetros previamente estabelecidos. Entre os princípios do design de Arquitetura da Informação foram levantados de Hierarquia, Prevenção dos erros ou tolerância, Restrição de âmbito. O princípio de Restrição de âmbito apresentou três dimensões de atuação: a da prevenção; a da proteção e a das informações. Entre os princípios do design de Experiência de Utilização foram levantados os de Afinidade, Causa-efeito, Relação esforço/recompensa. Concluímos 119 que a ferramenta de autoria deve permitir ao interator manipular os elementos da forma mais direta e intuitiva possível ao mesmo tempo que fornece um feedback das ações performadas. Uma ferramenta com um layout organizado e de fácil reconhecimento pode tornar-se familiar ao mesmo tempo que previne erros. Os levantamentos de padrões de design foram divididos em dois grupos: Estratégias de Interação e Estruturas de Interface. Entre os padrões de estratégias de interação foram levantados os padrões: Construção Incremental; Drag and Drop; Gratificação Instantânea; Pré-Visualização; Repetição Simplificada; Visualização Alternativa; Wizard. Entre os padrões de estruturas de interface foram levantados os padrões: Barra de Ferramentas com botões de ícones; Canvas mais Paleta; Ferramentas Contextuais; Painéis Fechados; Painel de Tarefas; Palco Central; Pilha de Cartas. Os padrões são soluções tangíveis dos princípios levantados. Os padrões levantados tornam fácil o acesso às funcionalidades do sistema na interface. A interface deve guiar o interator durante o processo de criação de forma simples, fornecendo somente as informações necessárias. E por fim, o interator deve ser capaz de ver as consequências de suas ações e desfazer as suas ações caso não goste dos resultados. Os levantamentos das estruturas de narrativas mostraram-nos que o tipo estrutura mais comum é o The Linear Plot, que se encontra em todos os sistemas. As estruturas de ramificações simples como o The Directed Network, The Branching Plot e The Foldback Plot são os outros tipos com maiores ocorrências, com nove ocorrências cada. O tipo Hidden Story foi o menos encontrado, com uma ocorrência. O sistema RPG Maker MV (2015) foi o sistema com maior número de estruturas possíveis de serem concebidas. Os sistemas Mario Paint (1992), StoryMapJS (2017) e The Adventures of Batman & Robin - Cartoon Maker (1995) foram os sistemas com novos tipos de estruturas possíveis, apenas a The Linear Plot. A ferramenta de autoria deve ser capaz de desenvolver ramificações nas suas estruturas visando permitir uma maior variedade de tipos existentes dentro do sistema. Os levantamentos dos níveis de participação esclarecem como pode ocorrer a participação em cada sistema. Podemos observar que o nível 1, interatividade periférica, é possível de ser concebida em todos os sistemas. Não houve registo de sistemas que permitissem a construção do nível 4 de participação. Os sistemas articy:draft 3 ( 2014) e Twine (2009) são os únicos sistemas que permitem narrativas com os nível 1, nível 2 e nível 3 de participação. Os levantamentos dos níveis de agência mostraram que a maior parte dos sistemas possui condições de conceber a sensação de agência no interator. Para o nível de agência direta, a sensação de agência gerada pela consequência direta das ações, ocorreu durante oito sistemas. Entre os sistemas levantados, apenas três não apresentaram a possibilidade de conceber a sensação de agência, o Mario Paint (1992), o StoryMapJS (2017) e The Adventures of Batman & Robin - Cartoon Maker (1995). Não foram considerados os casos onde os sistemas podem gerar a sensação de agência, mas a narrativa ativamente não o faz. Isto ocorreu, pois, se consideramos os sistemas que permitem retirar a agência de intencionalmente, a comparação com sistema que não são capazes de gerar agência seria prejudicada. A sensação de agência pode ocorrer de diversos modos, entretanto, observamos que sem a possibilidade 120 de agência por parte do interator a narrativa torna-se inflexível e imutável. Sem a agência do interator a narrativa não pode ser dinâmica e por consequência a travessias não é ergódica. A ferramenta de autoria deve permitir a agência do interator nas narrativas para viabilizar às travessias ergódicas possíveis. Os levantamentos dos tipos de travessias ergódicas esclarecem quais são os tipos de travessias possíveis nos sistemas levantados. Observamos que as travessias de Bending e Reprising são as travessias com maior ocorrência nos sistemas. A travessia com menor ocorrência é a Modulating. Os sistemas de articy:draft 3 (2014) RPG Maker MV (2015) e Twine (2009 são os sistemas que permitem todos os seis tipos de travessias ergódicas. Os sistemas Mario Paint (1992), o StoryMapJS (2017) e The Adventures of Batman & Robin - Cartoon Maker (1995) não permitem a construção de narrativas com travessias ergódicas. Observamos que a maior parte dos sistemas permite travessias que não excluem possibilidades do interator. As de Bending e Reprising permitem a exploração por parte do interator de forma livre ao alargar a narrativa quando quiser ou mesmo a repeti-la várias vezes. As ocorrências das travessias nos sistemas levantados evidenciam a importância de deixar a cargo do interator determinar o comprimento da narrativa, quando devem acabar e quantas vezes querem regressar a elas. Observamos que, para além dos princípios e padrões de design, a ferramenta de autoria deve preocupar-se com outros fatores como as estruturas narrativas, níveis de participação e agência que esta ferramenta pretende permitir nas narrativas criadas. A ferramenta de autoria deve ser capaz de criar estruturas ramificadas de narrativas. Sem a possibilidade de ramificações, o interator tem a sua participação limitada e pode inviabilizar as travessas ergódicas. O sistema deve permitir que o interator seja um agente ativo na narrativa. A sua participação tem que causar impacto relevante na ordem da narrativa. Sem uma participação de nível mais profundo, a agência pode tornar-se inexistente e o interator passa a ser apenas um espectador da narrativa. Sem a agência do interator, a travessia deixa de ser ergódica e torna-se estática e imutável. Uma ferramenta de autoria que visa construir narrativas interactivas com travessias ergódicas deve utilizar-se dos princípios e padrões de design para servir a este fim. O design do sistema deve permitir a construção de diferentes estruturas de narrativas, habilitar a participação do interator em diversos níveis e incluir o interator como agente ativo nas narrativas. Procuramos com estes levantamentos entender como relacionar as estruturas, a participação, a agência e as travessias ergódicas com os princípios e padrões de design. A comunhão destes fatores é que deve determinar as estratégias adotadas para a ferramenta de autoria. Com os levantamentos realizados e o registo das ocorrências, podemos determinar de forma qualitativa e quantitativa como os sistemas de análises podem contribuir para a construção de uma ferramenta de autoria. Com as estratégias definidas para o desenvolvimento da ferramenta, podemos propor soluções que permitam-nos ter um sistema eficiente para o design de narrativa interativas e as suas travessias. 121 Parte 2 Projeto 128 4. Prototipagem 4.1 Metodologia Para construirmos a ferramenta de autoria e a aplicação mobile foi preciso percebermos o que é esperado destas aplicações, quais os requisitos e funcionalidades que são necessárias para atingir o objetivo final. Para este fim, consideramos, no âmbito do projecto CHIC, os levantamentos de ferramentas de autoria (Capítulo 2), personas, cenários e contextos de uso (Capítulo 3). Todas as decisões foram tomadas em consenso entre as partes envolvidas no projeto. Após estabelecer as diretrizes das aplicações, foram decididos os requisitos e as funcionalidades essenciais para cada aplicação. A próxima etapa consistiu na criação de wireframes, mockups, protótipos interativos e, em união com as partes envolvidas, a programação para primeira versão da ferramenta de autoria e da aplicação mobile. Com protótipos funcionais desenvolvidos, foram realizados testes de usabilidade em ambas as aplicações. O protótipo foi iniciado no Figma devido às suas funcionalidades de desenho colaborativo e ser acessível diretamente pelo web browser. Nesta plataforma foram desenvolvidos os wireframes iniciais, design de interação, iterações e design de interface detalhados, com cores, tipografia, iconografia e layout definitivos. O protótipo interactivo 62 no Figma permitiram-nos testar uma versão próxima da versão final. Com este protótipo fomos capazes de testar as nossas suposições e teorias. 4.2 Requisitos, Navegação e User Flow A ferramenta de autoria para o projeto CHIC tem como o objetivo habilitar o interator a criar narrativas interativas com o uso da geolocalização como parte integrante da experiência. Com isto em mente, a ferramenta deve ser capaz de: 1. criar atividades e atribuir-lhes uma localização geográfica precisa; 2. atribuir um módulo de interação ludificada as atividades; 3. inserir conteúdos e media para as atividades; 4. ser capaz de interligar as atividades; 5. atribuir requisitos e gatilhos de ativação das atividades; 6. pré-visualizar os conteúdos; 7. disponibilizar as narrativas para a aplicação mobile. 62 Protótipo Interactivo da ferramenta de autoria: https://www.figma.com/proto/m4ZnlnHhp0UPbQFBilVABi/Projeto-CHIC---Autoring-Toolv2?scaling=contain&page-id=0%3A1&node-id=8%3A3. 129 Por se tratar de uma plataforma complexa, deve-se desenvolver uma interatividade e interface simples e intuitiva. Os princípios e padrões de design sumariados anteriormente (Capítulo 2) devem ser postos em prática e avaliados posteriormente. Para atingir os requisitos determinados, foram estipuladas as seguintes funcionalidades: 1. Criar experiência 2. Apagar experiência 3. Editar experiência 4. Guardar experiência 5. Criar um dock com os módulos 6. Expandir e esconder o painel com as atividades 7. Duplo clique ou clique e arraste uma atividade para o canvas 8. Ter um histórico de alterações 9. Ter 2 painéis de visualização: mapa e canvas 10. Criação, edição e eliminação das atividades 11. Ver a questão da ligação entre atividades 12. Ligação entre atividades 13. Pré-Visualização da experiência Para entendermos a estrutura da ferramenta de autoria, foi desenvolvido um mapa da ferramenta (Figura 4.1) que visa entender as secções que uma plataforma deste género poderá ter. Uma ferramenta de autoria pode ser uma estrutura complexa e, mesmo que algumas secções estejam fora do escopo deste trabalho, foi estruturado um mapa com todas as secções relevantes. Figura 4.1: Mapa de navegação da ferramenta de autoria para o projecto CHIC (2020). Antes de iniciarmos os wireframes, desenvolvemos um fluxograma da jornada do interator, desde o primeiro contacto com a plataforma até o último painel de configuração de uma atividade. Com isto em mente, é possível entender com mais profundidade o esforço que o interator deve fazer para 130 concluir a criação e edição de uma atividade. Entender este fluxo esclarece como deve ocorrer o processo de criação e como diminuir as suas barreiras. Figura 4.2: Fluxo do interator para a criação de experiência na ferramenta de autoria para o projecto CHIC (2020). Os requisitos e funcionalidades da plataforma são essenciais para determinarmos ações possíveis no sistema e como torná-las viáveis. O mapa de navegação permite-nos entender as secções existentes na ferramenta de autoria que devem ter prioridade durante o desenvolvimento. O fluxo do interator para a criação esclarece como tornar a experiência de criação menos custosa para o interator. Após coletarmos estas informações, iniciamos os primeiros passos do desenvolvimento da ferramenta de autoria. 4.3 Wireframes da Ferramenta de Autoria Os wireframes foram realizados primeiro como esboços em papel e evoluídos em plataformas digitais. Os primeiros foram focados na navegação do interator e na compreensão da organização e hierarquia adequada dos elementos no ecrã. Assim sendo, foram desenvolvidos com o uso limitado de cores, textos fictícios, imagens e ícones hipotéticos para preencher o layout das secções. Foi adotada a ferramenta Figma para desenhar os wireframes, protótipos interactivos e colaborar em equipa. 4.3.1 Dashboard O Dashboard é o primeiro ponto de contacto do interator com a ferramenta propriamente dita. Com isto em mente, o Dashboard deve disponibilizar acesso a todas as secções da ferramenta, criação e edição de experiências e a opção de Logout de forma rápida. A secção de Dashboard é onde o interator pode iniciar a criação de uma nova experiência interactiva e tem o controlo de todas as experiências desenvolvidas anteriormente, caso exista alguma. O interator pode reeditar experiências passadas, publicar experiências e retirá-las de publicação. No canto esquerdo encontra-se o menu principal em barra (Figura 4.3.a) com as seções disponíveis da ferramenta de autoria. O primeiro item no ecrã é o botão de menu e apresenta a versão expandida do menu lateral, com labels para os ícones. Este componente permite-nos equilibrar a presença de um menu crítico para a interface sem comprometer o layout das outras funcionalidades. O 131 interator pode expandir (Figura 4.3.b) para navegar e adquirir mais conhecimento acerca das secções na medida que julgar necessário. A escolha desta forma de menu está alinhada com o padrão de design de Barra de Ferramentas com botões de ícones e em sincronia com os casos. O centro do ecrã fica reservado à grelha de experiências (Figura 4.3.c). O primeiro elemento nesta área é o botão para criação de uma nova experiência (Figura 4.3.d). Esta é uma das principais funcionalidades uma vez que é o primeiro passo para o objetivo principal da ferramenta. É descrita nos cenários das personas, nos estudos de caso e com maior importância na hierarquia das informações. Com isto em mente, foi escolhido inserir esta funcionalidade como o primeiro item da grelha do Dashboard que contém as experiências. Na região superior direita encontra-se a funcionalidade de busca. Este campo de busca (Figura 4.3.e) é visto em estudos de caso e pretende facilitar o acesso às experiências para interatores intermediários e avançados. Figura 4.3: Primeira versão do wireframe do Dashboard e menu lateral expandido para a ferramenta de autoria para o projecto CHIC (2020). 4.3.2 Mapa A secção do Mapa é o modo de criação com a visualização focada na geolocalização. Ao iniciar a criação de uma nova experiência, a visualização do mapa (Figura 4.4.a) é apresentada ao interator. O mapa é o elemento principal na interface desta secção e está posicionado ao centro, a ocupar a maior parte do layout. Esta escolha foi feita em consideração ao padrão de design Palco Central e as ferramentas a orbitar as margens em sincronia com o padrão Canvas mais Paleta, sumariados anteriormente. Esta forma de hierarquização e organização é vista também nos casos de estudo. 132 As ferramentas primárias de criação (Figura 4.4.b) apresentam-se no menu superior da interface. As ferramentas disponíveis no menu superior são: a. Desfazer/Undo; b. Refazer/Redo; c. Adicionar Atividade/ Add Activity; d. Guardar/ Save; e. Pré-Visualização; f. Publicar/ Publish. No menu lateral são adicionados os botões que permitem alterar o modo de visualização (Figura 4.4.c) entre Mapa e Canvas. A disposição das ferramentas está alinhada com o padrão Barra de Ferramentas com botões de ícones. Ao inserir uma Atividade no mapa, o interator é apresentado a um painel específico para configuração dos parâmetros da atividade e inserção de media. O botão “Play” exibe a pré-visualização do resultado da experiência. O botão “Publish” apresenta o painel de publicação para disponibilizar a experiência. O interator tem a possibilidade de adicionar uma atividade ao clicar o botão “Add Activity”, entretanto a atividade irá surgir ao centro do ecrã. Desta forma a localização da atividade é gerada automaticamente e cabe ao interator ajustar o local exacto posteriormente. Em alternativa, o interator pode clicar e arrastar o ícone directamente no sítio desejado e o sistema atribui a coordenada correta à atividade. A escolha destes modos de inserção de atividade está alinhada com os padrões de Drag-andDrop e de Gratificação instantânea. Figura 4.4: Modo de visualização Mapa da ferramenta de autoria para o projecto CHIC (2020). 133 4.3.3 Canvas Em alternativa ao modo de criação através do Mapa, há o modo de criação Canvas. O layout no modo Canvas (Figura 4.5.a) é similar ao modo Mapa, entretanto, ao invés de um mapa como elemento central, há um espaço em branco livre para o interator adicionar atividades. O Canvas permite ao interator organizar as atividades de forma sequencial, diferente do modo Mapa que organiza por geolocalização. O canvas aplica os mesmos padrões do design e em sincronia ao caso de estudos que o modo Mapa. Figura 4.5: Modo de visualização Canvas da ferramenta de autoria para o projecto CHIC (2020). 4.3.4 Menu de Configuração da Atividade Ao introduzir uma atividade no Mapa, ou Canvas, o interator tem a possibilidade de definir os parâmetros desta atividade. O processo de configuração de uma atividade pode ser longo e custoso para o interator. Com isto em mente, este processo foi estruturado para ocorrer em etapas e com a possibilidade de guardar o progresso, sair e regressas no momento que desejar. Os padrões Wizard, Exploração Segura, Painel Modal, Painel de Tarefas e Painéis Fechados auxiliam-nos neste momento da criação. A primeira versão do painel de configuração propunha um painel modal sobre o modo de criação e direcionava o foco do interator somente no painel modal. A cada edição de uma atividade, o interator tem o seu fluxo de trabalho interrompido para focar somente no painel de configuração. O processo de configuração era dividido em secções de forma a guiar o processo por Construção Incremental. O processo de configuração foi divido em três partes: 1) Módulos (Figura 4.6.a); 2) Conteúdo (Figura 4.6.b); 3) Configurar (Figura 4.6.c) 134 Figura 4.6: Primeira versão dos menus de configuração da atividade para a ferramenta de autoria para o projecto CHIC (2020). Para a segunda versão do menu de configuração foi proposto o uso de um Painel de tarefas localizado à direita da interface. Esta proposta mantém os padrões da primeira versão, mas mantém o Palco Central do layout visível. O processo de edição da atividade foi dividido em cinco seções e organizado com o padrão de Painéis Fechados: 1) ID (Figura 4.7.a); 2) Módulos (Figura 4.7.b); 3) Conteúdo (Figura 4.7.c); 4) Ligações (Figura 4.7.d); 5) Requisitos (Figura 4.7.e). A ordem das secções foi reorganizada numa hierarquia a iniciar com parâmetros de relevância no âmbito macro até parâmetro de relevância no âmbito micro. Esta proposta foi escolhida por prover um melhor fluxo no processo de edição, comprometer um menor espaço do layout e estar alinhado com os casos de uso. Figura 4.7: Segunda versão dos menus de configuração da atividade para a ferramenta de autoria para o projecto CHIC (2020). 135 4.4 Wireflows da Ferramenta de Autoria Com os wireframes em mãos, procuramos entender como podem ocorrer os comportamentos da persona no contexto da interface da ferramenta de autoria. Para este fim, procuramos desenvolver wireflows que ilustrem como as principais interações devem ocorrer no uso da interface do sistema. Laubheimer (2016) define wireflow como um formato de especificação de design que combina wireframe com um de fluxograma simplificado que pretende representar as interações (Nielsen Norman Group, 2016). Com isto em mente, procuramos construir os wireflows que retratam as interações essenciais a construção de narrativas, travessias e os cenários de uso das personas descritos anteriormenteo (Secção 3.3.1). 4.4.1 Wireflow para a criação de uma atividade O wireflow abaixo teve como objetivo ilustrar o fluxo do interator do ecrã de Login até o último parâmetro de configuração de uma atividade. É importante iniciarmos o nosso entendimento com a sitação principal que todo interator terá que enfrentar, a criação de uma atividade. Todas as travessias na ferramenta de autoria surgem deste fluxo semples, porém essencial as narrativas. O wireflow para a criação da narrativa inicia com o interator a realizar o seu Login e acender ao Dashboard (Figura 1.1.a). Na página de Dashboard o interator clica o botão “Criar Nova Experiência” (Figura 1.1.b) localizado como o primeiro elemento na grelha de experiência ao centro do Dashboard, concebido com um icone “+”. No próximo passo, o interator tem acesso ao mapa e pode clicar no botão de “Adicionar Atividade” para adicionar uma nova atividade ao mapa. Em seguida, o interator carrega no icone da atividade (Figura 1.1.c) no mapa e tem acesso ao painel de tarefas no canto direito do ecrã. O painel de tarefas da acesso a cinco secção com diversos parametros a disposição. O interator primeiro configura os parâmetros em sequência: 1) A identificação da atividade no painel ID (Figura 1.1.d); 2) Escolhe o módulo na secção Módulos (Figura 1.1.e); 3) Inserir os conteúdos na secção Conteúdos (Figura 1.1.f); 4) Navega no painel de Ligações (Figura 1.1.g); 5) Determina os prérequisitos no painel de Requisitos (Figura 1.1.h). Figura 4.8: fluxo do interator para a criação de experiência na ferramenta de autoria para o projecto CHIC (2020). 136 4.4.2 Wireflow para uma narrativa de exploração livre O wireflow para uma narrativa de exploração livre visa ilustrar a situação onde os eventos não devem estar interligados e a travessia entre os eventos da narrativa é livre. Este wireflow foi criado de modo a entender como ocorrem as situações descritas no cenário 1: experiência exploratória (Secção 3.3.1), onde se deve construir uma ramificação, pode existir no processo de criação na interface da ferramenta. Neste wireflow o interator inicia o processo ao clicar no botão "Adicionar Atividade” (Figura 4.9.a) e em seguida aceder a secção de Requisitos no painel de tarefas (Figura 4.9.b). O interator configura a atividade para ser ativada apenas por proximidade e determina seu raio de ação. Em seguida o interator irá repetir este processo mais duas vezes (Figura 4.9.c, Figura 4.9.d, Figura 4.9.f e Figura 4.9.g). Por fim, a narrativa tem três atividades sem ligações entre si, entretanto com ativação por proximidade. Isto permite que o interator da aplicação mobile percorra entre as atividades da forma que julgar conveniente, bastando, apenas, aproximar-se do ponto de interesse. Figura 4.9: Fluxo do interator para a criação de experiência com exploração livre (2021). 4.4.3 Wireflow para uma narrativa com ramificações O wireflow para uma narrativa ramificada foi concebido para ilustrar a situação onde os eventos devem estar interligados, mas mais do que interligados, devem possibilitar uma escolha ao interator. Este wireflow visa entender como as situações descritas no cenário 2: experiência educativa (Secção 3.3.1), onde se deve construir uma ramificação, pode existir no processo de criação na interface da ferramenta. Neste wireflow o interator inicia o processo ao clicar no botão "Adicionar Atividade” duas vezes (Figura 4.10.a e Figura 4.10.b), criando duas atividades no mapa. Em seguida, o interator acende a secção de Ligações no painel de tarefas (Figura 4.10.c) para configurar a relação entre as duas atividades. Assim o interator consegue interligá-las e determina o sentido do fluxo da travessia. Após isto, o interator cria uma atividade com o botão “Adicionar Atividade” (Figura 4.10.d). Finalmente, 137 configura a relação entre a primeira atividade e a terceira atividade na secção de Ligações no painel de tarefas (Figura 4.10.e). Figura 4.10: Fluxo do interator para a criação de experiência com ramificação (2021). Os wireflows permitem-nos perceber o comportamento da interface em contextos de uso. Com este entendimento, seguimos com o desenvolvimento preciso da ferramenta de autoria. Procuramos construir uma interface que seja capaz de acomodar os processos levantados nos wireflows e permitir a construção das travessias que surgem através destes processos. 4.5 Design da Interface da Ferramenta de Autoria Com a construção dos wireframes e wireflows, percebemos como organizar a hierarquia dos elementos no ecrã, entender os meios de interação possíveis e aplicar os padrões de design sumariados. O próximo passo foi focarmos no design visual da interface e nos aproximarmos do resultado final desejado. Para este fim, foram escolhidas as fontes, a paletas de cores, os ícones, ilustrações e estruturado o design visual da ferramenta de autoria. Esta camada visual foi aplicada na interface para percebermos como comunicar os estados dos elementos visuais e o comportamento das interações durante a criação da experiência. Novas secções, painéis e funcionalidades foram criados para o estudo de cenários de utilização não antes desenvolvidos na fase de wireframes. O design da interface da ferramenta de autoria apresenta todos os padrões de design aplicados nos wireframes e obtidos nos levantamentos de ocorrências de estratégias de interação (Secção 2.3). Nesta etapa também foi desenvolvido um protótipo interativo no Figma para testarmos os cenários de uso. Procuramos mostrar os resultados possíveis de serem obtidos durante a construção da interface da ferramenta de autoria. 144 O Conjunto Cyclic Set (Figura 4.19.c) apresenta três atividades e propõe uma estrutura cíclica onde a primeira atividade também é a última atividade. Este conjunto permite estruturas totalmente interligadas, como a estrutura The Maze. O Cyclic Set permite a travessias de Reprising por padrão sendo a sua primeira atividade também a última. Esta estrutura permite criar narrativa onde a repetição dos mesmos pontos de interesse oferece uma maior experiência ao interator mobile. Esta estrutura pode ser combinada com o MultiModal Set e, através da configuração de requisitos, fornecer novos conteúdos para cada repetição na travessia do ponto de interesse. Figura 4.21: Exemplo de uso do conjunto de atividades Cyclic Set na ferramenta de autoria para o projecto CHIC(2020). O Conjunto Exploratory Set (Figura 4.19.d) apresenta três atividades e não há uma ligação direta entre as atividades. Este conjunto propõe uma exploração livre onde a atividade inicia-se com a proximidade. O Exploratory Set permite a travessia Bending por padrão, pois não há escolhas excludentes ou ordem pré-definida, sendo possível atravessar todas as atividades de forma livre. Este conjunto permite criar narrativas onde o interator mobile tem pouca agência, mas muita participação. Por não ter escolhas excludentes, o interator pode escolher a travessia baseada na trajetória entre os pontos de interesse no mundo real. Por outro lado, as narrativas exploratórias podem ter relevância emocional para o interator, pois às escolhas não são impostas pelo sistema. O interator escolhe conforme suas próprias motivações. Com este conjunto, as travessias de Branching, Reprising e Profiling são facilmente alcançadas com poucas alterações nos painéis de configurações. Figura 4.22: Exemplo de uso do conjunto de atividades Exploratory Set na ferramenta de autoria para o projecto CHIC (2020). 145 O Conjunto MultiModal Set (Figura 4.19.e) apresenta uma atividade que, entretanto, esta atividade apresenta três módulos de interação já programados. Este conjunto propõe uma solução para três atividades que ocorrem na mesma geolocalização, cada uma sendo ativada através do seu próprio requisito. O MultiModal Set permite as travessias Bending por padrão ao prolongar a interatividade num único sítio. Este conjunto oferece narrativas que promovam uma maior interação do interator mobile com o ponto de interesse. Esta interação pode ocorrer em camadas, onde a cada módulo que se interage um novo surge em sequência, fornecendo mais profundidade em proporção a interação com a atividade. Também é possível combinar este conjunto com o Cyclic Set para promover a travessia de Repring. Com algumas alterações nas secções de Ligações e Requisitos, a cada vez que se retorna ao ponto de interesse, um novo conteúdo é fornecido para o interator mobile. Figura 4.23: Exemplo de uso do conjunto de atividades MultiModal Set na ferramenta de autoria para o projecto CHIC (2020). O Conjunto Expanded Set (Figura 4.19.f) apresenta quatro atividades. Três são ligadas de forma linear. A primeira está conectada à segunda que está conectada à terceira. A quarta atividade conectase à segunda com uma conexão de via dupla. Desta forma o interator que chega à segunda atividade pode seguir para a terceira ou ir até à quarta, regressar à segunda e por fim seguir para a terceira. Este conjunto permite narrativas com estruturas que apresentem um fluxo direcionado para a narrativa, mas permite eventos secundários, como a estrutura The Directed Network. O Expanded Set permite a travessia de Bending por padrão, pois tem uma atividade opcional com ligação de via dupla, prolongando a experiência. Este conjunto permite a criação de narrativas lineares com ligações que promovam um aprofundamento na narrativa caso o interator da aplicação mobile deseja prolongar sua experiência. 146 Figura 4.24: Exemplo de uso do conjunto de atividades Expanded Set na ferramenta de autoria para o projecto CHIC(2020). As travessias de Modulating e Profiling não foram implementadas através dos conjuntos de narrativas. Estes tipos de travessias envolvem componentes sociais e análise do comportamento do interator com o sistema. Arranjos estruturais dos eventos da narrativa, como realizado pelos conjuntos de atividades, não têm a função de promover esses atributos. Para implementarmos as travessias de Modulating e Profiling, foi preciso desenvolver funcionalidades específicas para a interação social e para o comportamento do interator com o sistema, como a funcionalidade de Conquista (Secção 4.5.4), Tags (Secção 4.5.5) e Painel de Publicação (4.5.6). 4.6.2 Ligações A funcionalidade Ligações é uma das principais possibilidades da ferramenta de autoria. Ao criar duas ou mais atividades, o interator pode estabelecer a relação entre as atividades. No Painel de Tarefas a direita, o interator tem a possibilidade de adicionar ligações de origem, às atividades que permitem ao interator da aplicação mobile ter acesso a esta atividade específica. As ligações de Destino são as atividades que estarão acessíveis ao interator mobile quando finalizar esta atividade específica. A quantidade de ligação que uma atividade tem depende da vontade do interator. 147 Figura 4.25: Painel a na ferramenta de autoria para o projecto CHIC(2020). As Ligações permitem a concepção das travessias Branching com ramificação direcionada (Figura 4.26), onde o interator é obrigado a fazer uma escolha sem retorno. Figura 4.26: Exemplo de Travessia com Branching (2020). A travessia de Bending com ligações de via dupla (Figura 4.27), a qual o interator pode fazer uma escolha e voltar ao caminho e escolher outros eventos. 148 Figura 4.27: Exemplo de Travessia com Bending (2020). A travessia de Reprising com uma estrutura cíclica (Figura 4.27), onde o interator atravessa um evento da narrativa mais de uma vez. Figura 4.28: Exemplo de Travessia com Reprinsing (2020). 4.6.3 Requisitos A funcionalidade Requisitos permite ao interator determinar pré-requisitos a serem obtidos para a activação de uma atividade. No Painel de Tarefas a direita, permite determinar o horário em que a atividade está disponível, a distância mínima para ativação, quais atividades devem ser realizadas e quais não podem ser realizadas. Os parâmetros de Distância e Realizar permitem a travessia de Bending. Com o parâmetro de Não Realizar pode-se conceber a travessia de Branching ao excluir opções ao ativar a atividade. Os parâmetros de horário podem contribuir para a travessia de Profiling ao mapear o comportamento e escolhas do interator. O sistema pode usar os horários de maior interação do interator da aplicação mobile como um marcador para as preferências de uso e com estes dados obter uma melhor compreensão do comportamento do interator da aplicação mobile. Assim sendo, o sistema pode sugerir novas experiências ao interator baseado nos seus horários de maior uso. 149 Figura 4.29: Painel de Requisitos na ferramenta de autoria para o projecto CHIC (2020). 4.6.4 Conquistas A funcionalidade de Conquista premia o interator da aplicação mobile que finaliza a experiência. O interator da aplicação mobile recebe um “troféu” pelo esforço de completar a experiência. O interator atribui um nome e uma imagem para a conquista a ser entregue pelo sistema. Figura 4.30: Painel de Conquista na ferramenta de autoria para o projecto CHIC (2020). A Conquista pode ser usada como requisito de outras experiências no sistema. Com a funcionalidade Conquista o interator pode construir a travessia de Profiling. As Conquistas são percebidos pelo interator da aplicação mobile como uma recompensa pelo seu esforço. Entretanto, para o sistema, conquistas podem ser utilizadas como marcadores do comportamento do interator com a aplicação. Uma conquista pode agrupar todos os outros marcadores de uma experiência, como tags e horários, e associar estes dados ao perfil do interator. Com estes dados associados, o sistema pode prever o comportamento do interator e sugerir experiências similares a essas conquistas obtidas. 150 4.6.5 Tags A funcionalidade Tags (Figura 4.31.a, Figura 4.31.b e Figura 4.31.c) cria categorização e auxilia ao interator da aplicação mobile na escolha de qual experiência deseja vivenciar. O interator pode atribuir quantas tags forem necessárias para uma experiência ou atividade. Figura 4.31 Tags nos painéis de configuração gerais da experiência. A esquerda, no painel de configuração ID da atividade, ao centro, e no painel de publicação, a direita, da experiência na ferramenta de autoria para o projecto CHIC (2020). O sistema pode usar estas tags como marcadores e usar estes dados para rever o comportamento do interator da aplicação mobile. As tags, interpretadas pelo sistema como marcadores dos comportamentos, auxiliam a construção de travessia do tipo Profiling. O sistema pode identificar as tags mais escolhidas pelo interator da aplicação mobile e sugerir experiências com tags iguais ou similares. Com o tempo, o sistema pode construir um perfil da utilização do interator da aplicação mobile baseado nesses marcadores. Na perspetiva do interator da aplicação mobile, as tags auxiliam a pesquisa por experiências associadas a um tema de interesse. 4.6.6 Painel de Publicação As funcionalidades de partilha de experiências permitem o interator da ferramenta de autoria convidar pessoas diretamente ou disponibilizar sua narrativa em diferentes redes sociais. 151 Figura 4.32: Painel de Conquista na ferramenta de autoria para o projecto CHIC (2020). Ao convidar pessoas para participarem das experiências, o tecido social do sistema torna-se um reflexo do tecido social do mundo real. O interator pode convidar pessoas de acordo com critérios pessoais. Isto pode influenciar a forma como as narrativas são construídas e vivenciadas. Este contexto social, concebido através da partilha de experiências, torna possível a travessia de Modulating no sistema. Após construirmos o design de interface definitivo, construímos ferramentas para a construção de narrativas interativas e travessias no sistema. Com isto em mente, construímos um protótipo interativo e um protótipo funcional. Com estes protótipos, podemos testar as soluções encontradas com interatores correspondentes com a persona definida. 152 5. Testes de Usabilidade Foi construído um protótipo funcional 63 desenvolvido pelos programadores front-end e back-end envolvidos no projecto. Devido à complexidade do projecto e tempo disponível, não foi possível implementar todas as propostas para a ferramenta de autoria. Lembramos que o sistema contempla duas aplicações interdependentes, a ferramenta de autoria e aplicação mobile, 64 o que contribuiu para a dificuldade do projecto. Com isto em mente, o protótipo funcional aproxima-se do resultado com fidelidade e desempenha as principais funções do sistema. Com ambos os protótipos desenvolvidos, iniciámos a fase de teste. Ao combinar os dois protótipos, foi possível elaborar testes mais precisos e cobrir todos os cenários das personas detalhados anteriormente. 5.1 Métodos e Procedimentos A metodologia utilizada para a avaliação do protótipo foi uma combinação de dois questionários quantitativos, testes de usabilidade, um questionário SUS. Um plano de teste foi elaborado para detalhar cada etapa dos testes com os utilizadores. Um questionário, acerca do perfil demográfico e áreas de interesse, foi entregue antes do teste. Durante os testes, os participantes foram convidados a concretizar algumas tarefas de acordo com os cenários. Os moderadores tiveram acesso ao plano de testes. Os moderadores observaram se as tarefas eram concluídas pelos participantes enquanto realizavam os cenários de testes. De seguida, foi entregue aos participantes um questionário acerca das impressões sobre a aplicação e o questionário SUS. Primeiramente, foi testado o protótipo interactivo a fim de testar soluções de interface que não foram possíveis de serem implementadas no protótipo funcional. Em seguida, foi testado o protótipo funcional com o objetivo de testar as soluções de interação e interface para a criação de narrativas e o design de travessias mais próximo possível de uma versão final da ferramenta de autoria. As sessões foram gravadas em vídeo para melhor analisar a forma como interagiam com a aplicação em combinação com a Think Aloud Protocol. Devido ao cenário de pandemia da COVID-19, os testes da ferramenta de autoria foram realizados remotamente, via Google Meet, onde foi possível gravar os ecrãs dos participantes. Para a aplicação mobile não foi possível realizar remotamente, sendo escolhidos participantes próximos ao moderador para juntos realizarem os testes através da cidade. 63 Prototipo Funcional da ferramenta de autoria: https://chic-15ea3.firebaseapp.com/dashboard 64 Prototipo Funcional da aplicação mobile: https://chic-mobile.firebaseapp.com/dashboard 153 Para os testes foram desenvolvidos documentos para conduzir os testes: o plano de testes, cenários, lista de tarefas, os questionários. Todos os documentos foram realizados tanto para a ferramenta de autoria (Anexo B) como para a aplicação mobile. Após a realização dos testes foram elaborados relatórios com os dados dos perfis dos participantes bem como dos resultados dos testes de usabilidade. 5.2 Perfil dos Participantes dos Teste da Ferramenta de Autoria Este projecto contempla duas aplicações interdependentes, por esta razão foi preciso desenvolver testes distintos para cada uma das aplicações. Todos os participantes apresentam áreas de interesses e objetivos similares aos descritos nas personas. Entretanto, devido ao cenário da pandemia do COVID19 e limitações de disponibilidade, os participantes não correspondem idealmente ao perfil pretendido, mas encontram-se dentro de um espectro o mais aproximado possível, possível. Ressaltamos nesta secção o perfil dos participantes dos testes para a ferramenta de autoria. 256 ● Escolher a atividade final ● Utilizar um conjunto de atividades ● Pré-visualizar ● Publicar ● Voltar ao dashboard C.5.4 Cenário 02 Criar uma nova experiência (Ferramenta Autoria) Tabela C.11: Resultados Participante 04 para o cenário de testes 02 da ferramenta de autoria. Tarefas Concretizou Comentário Nível impacto Tempo Adicionar nova experiência Sim Adicionar Atividade Sim Configurar atividade Sim Utilizar uma ligação Sim Utilizar uma atividade sem ligação Não Escolher a atividade inicial Sim Escolher a atividade final Não Utilizar um conjunto de atividades Sim Pré-visualizar Sim Publicar Não Voltar ao Dashboard Sim Notas: ___________________________________________________________________ ___________________________________________________________________ ___________________________________________________________________ 257 C.5.5 Transcrição de excertos do teste 04 de usabilidade Tabela C.12: Transcrições dos testes da Participante 04 Protótipo e Timecode Discurso Ação Observação Protótipo Interactivo 00:07:07:00 “Aqui nestes ícones, seria fixe, tipo, aparecer alguma legendazinha. Para perceber que cada um faz senão não sei o que que cada ícone significa.” A participante navega com o cursor sobre os ícones da secção Módulos. Ao navegar pela secção de Módulos, a participante sugere o uso de legendas para cada um dos módulos. Sem esta indicação, não é possível perceber o que cada ícone significa. Protótipo Interactivo 00:08:04:00 “Eu não sei o que é suposto aparecer aqui.” A participante clica no switch e alterna do modo Mapa para o Canvas. Ao mudar para o modo Canvas, o fundo branco do layout causa confusão. A participante conclui que algo a mais era suposto aparecer. Protótipo Funcional 00:01:49:00 A participante seleciona o conjunto de atividade Linear Set. Ao interagir com o protótipo funcional, a primeira tentativa de criar uma atividade foi através do uso de um conjunto de atividades. Após navegar pelas opções, a participante selecionou o Linear Set. Protótipo Funcional 00:11:45:00 “Vou fazer assim” A participante seleciona o conjunto de atividade Cyclic Set. Ao iniciar, de forma definitiva, a criação de sua experiência, a participante opta por iniciá-la com o conjunto Cyclic Set. Protótipo Funcional 00:13:21:00 “E agora? Queria adicionar mais. Ah, ok.” A participante usa o menu contextual e seleciona a opção para adicionar atividade. A participante faz uso do menu contextual para adicionar uma atividade a mais em sua experiência. Protótipo Funcional 00:14:04:00 “Não estou a perceber porque. Eu tou a tentar criar daqui uma ramificação e ta a criar só dali.” A participante usa o menu contextual e seleciona a opção para adicionar atividade. A participante faz uso do menu contextual para adicionar uma atividade. Entretanto a atividade está a surgir com uma conectada a uma atividade diferente da selecionada pela participante. Isto ocorre, pois, a atividade seleciona é intermediária e o sistema cria novas atividade a partir da última previamente adicionada. Protótipo Funcional 00:17:41:00 “Ok, não sei muito bem o que que é essa parte dos módulos.” A participante interage com os botões dos módulos. Ao interagir com as opções de módulos, a participante declara não perceber qual é o propósito dos Módulos no sistema. 258 Apêndice D - Documentação da Ferramenta de Autoria D.1 Wireframes realizados para a Ferramenta de Autoria Figura D.1: Wireframe do Login. 259 Figura D.2: Wireframe do Dashboard. Figura D.3: Wireframe do Mapa. Figura D.4: Wireframe do Mapa com uma atividade. 260 Figura D.5: Wireframe do Canvas com uma atividade. Figura D.6: Wireframe do Mapa com uma narrativa construída. 261 Figura D.7: Wireframe do Menu de configuração para a secção Módulos. Figura D.8: Wireframe do Menu de configuração para a secção Conteúdo. 262 Figura D.9: Wireframe do Menu de configuração para a secção Configurar. Figura D.10: Wireframe do Painel de Tarefas. 263 Figura D.11: Wireframe do Painel de Tarefas para a secção ID. Figura D.12: Wireframe do Painel de Tarefas para a secção Módulos. 264 Figura D.13: Wireframe do Painel de Tarefas para a secção Conteúdo. Figura D.14: Wireframe do Painel de Tarefas para a secção Ligações. 265 Figura D.15: Wireframe do Painel de Tarefas para a secção Requisitos. Figura D.16: Wireframe do painel Publicar. 272 Figura D.29: Design da interface do Painel de Tarefas para a secção Ligações. Figura D.30: Design da interface do Painel de Tarefas para a secção Requisitos. 273 Figura D.31: Design da interface dos painéis de Pre-visualização de uma actividade. Figura D.32: Design da interface do panel Publish Figura D.33: Ícones para diferentes estados de uma atividade. Figura D.34: Ícones para os Módulos. 274 D.3 Melhoria realizadas na interface da Ferramenta de Autoria Figura D.35: Melhoria para o Dashboard. Figura D.36: Melhoria para o Mapa. 275 Figura D.37: Melhoria para o Canvas. Figura D.38: Melhoria do Painel de Tarefas. 276 Figura D.39: Melhoria do Painel de Tarefas da atividade. Figura D.40: Melhoria do Painel de Tarefas para a secção ID. 277 Figura D.41: Melhoria do Painel de Tarefas para a secção Mósulos. Figura D.42: Melhoria do Painel de Tarefas para a secção Conteúdo. 278 Figura D.43: Melhoria do Painel de Tarefas para a secção Ligações. Figura D.44: Melhoria do Painel de Tarefas para a secção Requisitos. 279 Figura D.45: Melhoria do painel de Pré-visualização. Figura D.46: Melhoria do painel Publicar.