0. Introdução

Depois de quatro capítulos escritos, chegou o momento de rematar a história e deixá-la pronta para ser partilhada com outros. As tarefas desta semana vão pedir-te que:

1. leves a tua história até um momento conclusivo da ação (que não tem de necessariamente ser o final da história):
2. personalizes a apresentação visual da tua história, alterando coisas como o tipo de letra ou a cor do fundo .
3. revejas e testes a tua história para a deixares pronta para ser divulgada na Internet para todos os que queiram jogar ficção interativa em português.

Como habitualmente, deves realizar esta tarefa no mesmo ficheiro do Twine. E, pelo sim, pelo não, convém fazeres uma nova cópia de segurança da tua história.

1. Objetivos

Durante a escrita deste capítulo, estarás a trabalhar para cumprir os seguintes objetivos:

• Construir um momento conclusivo na tua narração.
• Assegurar a coerência e coesão de um texto.
• Esforçar-te por teres um texto sem gralhas, sem erros ortográficos e gramaticais.
• Ser capaz de formatar um texto de forma legível e cativante.
• Adquirir conhecimentos elementares da linguagem de programação CSS (Cascading Style Sheets)
• Apurar o sentido estético, através do trabalho de embelezamento da história.

2. Vamos escrever

Como já indicado, deves levar a tua história até um momento conclusivo. Não tem que ser necessariamente o fim da história, apenas um momento adequado em que decides suspender a ação. Pode ser uma reflexão final do detetive ou então um último momento em que há uma súbita mutação dos acontecimentos (uma peripécia no sentido de Aristóteles) e deixar o leitor a chorar por mais. Ah, isto seria ouro sobre azul, e teriam criado um verdadeiro cliffhanger. 

3. Vamos personalizar

Quando escreves um texto no Microsoft Word, alterar o tipo de letra, o seu tamanho e a cor são coisas normalíssimas, assim como, alterar o espaçamento entre as linhas, mudar a cor do fundo, inserir imagens ao lado do texto, etc.

Pois bem, no Twine podes também alterar essas coisas todas e de certeza que, em algum momento neste semestre, já tiveste vontade de o fazer. Vamos, então, a isso. Os procedimentos não são complicados, mas são diferentes dos do Microsoft Word, o que significa que vamos ter que mergulhar um bocadinho na linguagem de programação CSS, que é, hoje em dia, umas das linguagens mais usadas para construir páginas de Internet.

3.1. “A passagem de abertura” — a capa do livro

Todos os livros começam com uma capa, uma boa capa de preferência, onde se começa logo a criar o ambiente da história que se vai encontrar. Uma obra de ficção interativa não é diferente. Nada melhor do que começar a história numa passagem em que se apresenta, pelo menos, o título da história e o nome do autor antes de se começar o jogo. Eu fiz isto para a minha história “Férias na Montanha”

Esta é uma “capa” muito rudimentar e inclui, apenas, o básico: o nome da história, o nome do autor e uma ligação para começar a história.

E como é que se faz isto? Simples, olhem aqui para o código da passagem:

<h2>Férias na Montanha</h2>
<h5>por José Carlos Dias</h5>

[[Começar|Cabana]]

O Twine tem seis tamanhos pré-programados (de h1 a h6) que pode ser usados, bastando rodear o texto com as etiquetas do tamanho desejado. Experimentem escrever numa passagem do vosso jogo o código abaixo para ficarem com uma ideia mais clara:

<h1>A minha história</h1>
<h2>A minha história</h2>
<h3>A minha história</h3>
<h4>A minha história</h4>
<h5>A minha história</h5>
<h6>A minha história</h6>

Dica catita

O exemplo de capa acima apresentado tem as informações essenciais, mas podia ainda incluir outras coisas. Por exemplo, o nome do autor podia também ser uma ligação e levar a uma passagem onde vocês se apresentam. Podia também haver ligações para passagens com a ficha técnica do jogo, com um prefácio à obra, com instruções, etc, etc.

3.2. Alterar a apresentação da história

Vamos então começar a “falar” CSS. Atenção! As seguintes alterações terão de ser introduzidas na “folha de estilos da história”, acessível através da setinha à direita do título da vossa história. Todas estas alterações são globais, ou seja, irão afetar todas as passagens da vossa história. Para alterações locais, só de uma passagem, vejam o ponto 3.3.

3.2.1. Alterar o tipo de letra

Por defeito, o Twine usa a fonte Georgia, tamanho 14,5, de cor preta, sobre um fundo branco. Para mudarmos o tipo de letra, introduzimos o seguinte código na folha de estilos:

tw-passage { font-family: arial; }

E quem diz “arial”, diz outra fonte qualquer comum na Internet. Experimentem mudar o nome “arial” por uma destas.

Book Antiqua, Times New Roman, Arial, Helvetica, Impact, Tahoma, Verdana, Courier New.

Sim, é verdade, estas fontes aqui são um pouco aborrecidas. Mas não se preocupem porque podem usar qualquer fonte do Google Fonts. Só têm de fazer o seguinte:

• Vão até ao Google Fonts
• Vejam as fontes disponíveis. Quando gostarem duma, carreguem no botão vermelho com um +.  
• Façam isso para todas as fontes que quiserem experimentar no Twine (comecem com 1 ou duas fontes para verem como funciona).
• Quando tiverem escolhido as fontes todas, carreguem na barra que está em baixo com o texto “x famílias escolhidas” (pode estar em outra língua).
• Depois no menu “Embed Font”, escolham @IMPORT.
• Copiem a informação toda que está entre as etiquetas style, que começa com @import

@import url('https://fonts.googleapis.com/css?family=Kumar+One');

• Ainda no Google Fonts, apontem o nome da fonte, que está debaixo de “Specify in CSS”. O nome está entre aspas simples.

font-family: 'Barrio', cursive;
font-family: 'Kumar One', cursive;

• Voltem à folha de estilos da vossa história no Twine.
• Colem no topo da folha de estilos da vossa história, o endereço que copiaram do Google Fonts (o que começa por @import…)
• E agora basta pôr o nome da fonte da Google no sítio correto.

tw-passage { font-family: 'Kumar One'; }

3.2.2. Mudar o tamanho da fonte e o espaçamento entre linhas

Para mudar o tamanho da fonte, acrescentem à folha de estilos:

// Isto vai aumentar em 50% o tamanho da fonte
tw-passage { font-size: 150%; }

* podem alterar o valor da percentagem (25%, 50%, 200%, etc.)

E, de forma semelhante, podem alterar o espaçamento entre linhas:

// Isto vai aumentar em 50% o espaçamento entre linhas
tw-passage { line-height: 150%; }

* podem alterar o valor da percentagem (25%, 50%, 200%, etc.)

3.2.3. Mudar a cor da fonte

Mudar a cor da fonte é igualmente simples, só que, esperem, primeiro é preciso escolher que cor é que querem mudar. É que o texto, no Twine, pode ter até 5 cores diferentes. Ora vejam lá:

1. A cor do texto sem ligação.
2. A cor do texto com uma ligação.
3. A cor do texto com uma ligação que já foi visitada.
4. A cor do texto com uma ligação quando o rato lhe passa por cima.
5. A cor do texto com uma ligação que já foi visitada quando o rato lhe passa por cima.

As cores mais visíveis serão sempre as 1 e a 2. Para alterarem estas cores, basta usar este código na folha de estilos (as linhas estão organizadas segundo o exemplo acima):

tw-passage {color: #000000;}
tw-link {color: black; }
tw-link:hover {color: #cc8800; }
tw-link.visited {color: black;}
tw-link.visited:hover {color: #cc8800;}

Como podem ver, a cor pode ser identificada ou pelo nome em inglês ou pelo endereço hexadecimal. Se precisarem de ajuda para escolher a cor certa, este endereço pode ajudar.

Eu, pessoalmente, não gosto que as cores (3) e (5), e (2) e (4) sejam diferentes, porque não me interessa marcar que uma passagem já foi visitada. Mas isto é uma questão de gosto, obviamente.

3.2.4. Mudar a cor do fundo

Por defeito, o Twine apresenta as histórias sobre um fundo branco. Se quiserem mudá-lo, nada mais fácil. Basta acrescentar isto à folha de estilos, com a vossa cor.

body {background-color: #ffff00}

Mais uma vez, o site da W3Schools pode ajudar-vos a encontrar a cor certa.

E ficamos por aqui no que diz respeito a mudanças na apresentação da vossa história. Há muito ainda que se podia fazer. Se quiserem uma alteração rápida do aspeto da vossa história, vão até esta página e copiem todo o código que lá está e ponham-no na vossa filha de estilos e vejam o que acontece 🙂

3.3 Alterações nas passagens

Todas as alterações apresentadas nos pontos anteriores são globais, ou seja, as mudanças afetam todas as passagens. Se quiseres fazer apenas alterações pontuais numa passagem ou em algumas passagens, deves usar macros. Olha para os seguintes exemplos:

// mudar o tipo de letra
Este fragmento vai aparecer com a fonte habitual do Twine(font: "courier new")[, mas este aparece com o tipo de letra 'courier'.]

// mudar a cor do texto
(text-color: "#CC0000")[Estas palavras vão aparecer a vermelho.] Estas já vão estar em preto.

// criar efeitos de texto
(text-style: "blink")[Estas palavras vão aparecer a piscar.]

* há vários efeitos como: saltar ("rumble"), aparecer e desaparecer ("fade-in-out"), tremer ("shudder"). As palavras podem aparecer tremidas ("blur" ou "blurrier"), sujas ("smear"), realçadas ("mark"), como vistas num espelho ("mirror") ou de pernas para o ar ("upside-down). 

//  criar transições de texto (mudar como o texto surge no início da passagem)
(transition: "dissolve")[o texto vai aparecer suavemente no ecrã. Esta é a transição por defeito no Twine

* há outras como: pulsar ("pulse") ou abanar  ("shudder").

Caso queiram associar um tipo de letra e uma cor a uma certa personagem ou voz na vossa história, podem simplificar este processo recorrendo a uma variável. No exemplo abaixo, vamos mostrar como distinguir a voz dos pensamentos de uma personagem:

Primeiro, associam uma variável ao estilo desejado, por exemplo:

(set: $pp = (font: "courier new") + (text-color: "#CC0000"))

Depois, nas passagens, sempre que houver pensamentos da personagem, façam:

$pp[E aqui vão os pensamentos da personagem na fonte courier e em vermelho]

Muito mais fácil do que estar sempre a indicar a fonte e a cor em cada ocorrência.

3.4 Imagens, som e vídeo

Podes também integrar, na tua história, conteúdos multimédia como imagens, sons e vídeos. No entanto, esta operação é bastante mais complexa, especialmente quando se usa a versão online do Twine. Por outro lado, já não é um trabalho textual, pelo que não se enquadra bem no objetivo deste projeto.

De qualquer forma, há muitos recursos na Internet que te podem ajudar a realizar estas tarefas. Podes começar por assistir aos vídeos do Dan Cox no Youtube. E daí continuar a aventura 🙂

4. Vamos rever

A revisão é uma parte fundamental de qualquer obra criativa, seja ela literária ou de qualquer outra natureza artística. Uma boa revisão é aquilo que pode transformar um bom trabalho num trabalho extraordinário, por isso, não descurem este passo.

Idealmente, ela deve ser feita por uma outra pessoa, por alguém que esteja a contactar com o trabalho pela primeira vez. Desta forma, consegue-se uma experiência semelhante àquela que os leitores vão ter.

Por isso, cada um irá ser revisor da história de um colega. Mais informações sobre esta subtarefa nas aulas desta semana.

4.1. Revisão da história

Este é o momento para fazeres os ajustes finais à tua história. Verifica se a história progride como planeado, e se o leitor/jogador irá ter a experiência que desejas. Certifica-te de que não há incoerências nas personagens, nem na progressão da narrativa.

4.2. Revisão linguística

Revê todo o teu conteúdo, bem como as várias versões corrigidas, para eliminares gralhas e erros que ainda existam. Aproveita também para apurares o teu estilo e para te certificares que a tua escrita é, simultaneamente, correta, clara e bonita.

4.3. Revisão no Twine

A escrita da ficção interativa foi uma experiência nova para ti neste semestre, e dominas muito melhor o Twine agora do que no início. Por isso, vale a pena regressares ao início e analisar as primeiras passagens à luz do que agora sabes e melhorá-las. Presta especial atenção ao seguinte:

• o texto de uma passagem deve ocupar, no máximo, a dimensão de um ecrã.
• o texto deve ter os parágrafos bem definidos para facilitar a leitura, por exemplo, com uma linha de intervalo.
• o texto revelado pelas macros (link: ) por vezes perde-se no parágrafo onde surge, especialmente se for num com muito texto. Para resolveres este problema, podes isolar o texto revelado ou fazê-lo aparecer com um efeito de transição (mais sobre isto acima no ponto 3.3).

5. Avaliação

O trabalho será avaliado com base nos seguintes critérios:

• Qualidade do texto (70%)
  • correção ortográfica e gramatical;
  • rigor lexical
  • coerência e consistência da história;
  • originalidade da história;
  • cumprimento das obrigações apresentadas.
• Personalização da aparência da história (20%)
• Correta utilização do Twine (10%)
  • implementação das macros;
  • qualidade da interação;
  • apresentação do texto.

6. Entrega do trabalho

Presta atenção ao cronograma para este tarefa:

---

Para o 2.º do curso de licenciatura em estudos portugueses:

Realização das tarefas 1 e 2 (conclusão da escrita e personalização)
4 de junho de 2017 (vejam o ponto 6.1 com as instruções de entrega)

Revisão da obra de um colega
5 de junho de 2017

Entrega final do trabalho
11 de junho

---

Para o 1.º do curso de mestrado em estudos portugueses:

Realização das tarefas 1 e 2 (conclusão da escrita e personalização)
5 de junho de 2017 (vejam o ponto 6.1 com as instruções de entrega)

Revisão da obra de um colega
6 de junho de 2017

Entrega final do trabalho
11 de junho

6.1. Como entregar o trabalho

Como o Twine grava a história automaticamente no vosso navegador, para obterem devem seguir estes passos:

1. No ecrã do mapa da história, do lado esquerdo, clica na seta ao lado do nome da história e escolhe a opção “Publicar como ficheiro”.

2. O arquivo deve ser automaticamente descarregado pelo vosso navegador.

3. Já no vosso computador, mudem o nome do arquivo para a seguinte estrutura:

Ano_NomeDaHistória_FINAL_PrimeiroNomeDosAutores

Ex: 2_ACasaPerdida_FINAL_AgnieszkaKinga.html

Ex: 4_ALuaDePapel_FINAL_Ewa.html

4. Para entregarem o vosso ficheiro, vão até este endereço e enviem-no para a pasta partilhada que aí se encontra.