Tutorial: Desenvolvendo Histórias Interativas Não Lineares com o Twine – Parte 2 – Formatando o Texto

No último tutorial, entendemos o Twine, interface e suas funcionalidades básicas ao se criar uma história bem pequena.

Agora, vamos conhecer um pouco sobre a formatação do texto que ele oferece.

Vamos nessa!

 

Desafio e Mais sobre Passagens

Conseguiu fazer a formatação pedida na última postagem? Caso não tenha, vamos conhecer hoje algumas peculiaridades da formatação que você já vai conseguir fazer o negrito e itálico de boa.

Um detalhe sobre as passagens bem importante:

  • Não se pode usar nos nomes de passagens colchetes ( [ ) nem a barra ( | ), pois ela tem usos específicos dentro das passagens;
  • Também as passagens são case sensitive, ou seja, se eu criar uma passagem A HISTÓRIA DAS NOVE ou A História das Nove ou a história das nove, ele considerará como passagens diferentes, não a mesma. Dessa forma, ele diferencia a passagem pelas maiúsculas e minúsculas.

 

Antes de Formatar Qualquer História…

twine_P2_00É muito importante que você sempre verifique qual o formato da história que está sendo usado (Story Format). Por que isso? Pois alguns marcadores, recursos Twine e aplicações de CSS não funcionam em alguns deles.

No nosso tutorial, vou usar o SugarCube, pois é bem atualizado, bonito, tem documentação boa, já possui alguns recursos padrões muito bons, como saves para load depois, e torna mais fácil o uso do Twine para iniciantes. Senão, você tem que ser obrigado a conhecer sobre HTML e outras coisas.

Como faço para mudar o Story Format? Vá abaixo no nome da sua história (no meu caso, A Fábrica de Jogos) e escolha a Opção “Change Story Format”.

Opte pela SugarCube e feche a janela. Pronto. Só dar “Play” que verá o resultado.

 

Formatações Básicas no Twine

Existem diversas formatações a serem usadas pelo Twine. Ele oferece alguns recursos como //texto// para itálico, ‘’texto’’ (duas aspas simples) para negrito, mas, como já mencionado, cuide com o Formato da História, pois alguns podem não funcionar.

Particularmente, achei mais fácil de usar para quem é iniciante, pois criar tabelas, por exemplo, com HTML é bem mais complicado que no Twine.

Mais informações de sintaxe do Twine, segue o link de acesso: Syntax – Twine. Inclusive me baseei muito de lá, mas aqui está em português e com telas rodando para ver resultado. 😉

Vamos ver o primeiro grupo de marcadores:

twine_P2_01

O uso deles é bem simples. Fiz aqui o uso deles em uma passagem Twine:

twine_P2_02

Aqui o resultado de como ficou:

twine_P2_03Alguns detalhes devo mencionar. O Comentário serve para o autor da história usa para fazer anotações dele, comentar códigos de programação e outros. Não aparecerá para nosso jogador/leitor, só para ele.

Já Erro acho mais útil para quando vermos a parte de programação.

O último de CSS, é necessário você conhecer atributos de configuração de CSS (ou folhas de estilo). No site da W3C você pode ver os tipos existentes. No exemplo, usei um para configuração de fonte, mas tem para borda, tabela e outros.

Também há específicos do Twine que vou explicar no próximo tutorial (como .passage).

Outras formatações possíveis de serem feitas:

twine_P2_04

A forma de uso é a mesma dos anteriores. Veja aqui o uso e como ficou:

twine_P2_05

Como ficou:

twine_P2_06

Tranquilo de usar? Teste, faça diferentes usos, formatações e assim você se acostuma com o uso de cada um deles. 😉

Quem já brincou com páginas wiki e a formatação deles, vai achar bem parecida a brincadeira.

 

Outras Formatações Possíveis no Twine

Observe que, na demonstração anterior, ao usar o Monospace, ficaram alguns espaços em branco. Isso se deve, pois eram os espaços que tinham as chaves {{{ e }}}. O Twine acaba considerando qualquer escrita – mesmo que o leitor não a veja – como linha em branco válida para aparecer na história/jogo.

Logo, se não quer que fiquem esse tipo de espaço, use a barra invertida (\) no fim da linha vizinha. Assim, elimina-se o espaço seguinte de linha. Veja como fiz:

twine_P2_07

Veja como ficou:

twine_P2_08

Compare com o anterior e verá que não tem mais tantos espaços em branco assim. Quando vermos a parte de código, ele vai fazer a mesma coisa. Aí tem esse recurso e outro que ensinarei quando chegarmos nessa parte. 😉

Também podemos criar tabelas.  Veja como construí o código aqui:

twine_P2_09

Veja como ficou aqui:

twine_P2_10

Ali explico alguns detalhes de uso da tabela para mesclar, deixar em branco célula, cabeçalho e outros. Só brincar e ver o que acontece. É a melhor forma de aprender esses recursos.

 

Formatações com HTML

Você pode usar no Twine também marcadores HTML. Caso conheça bem a linguagem e tem intimidade com ela, pode usá-la tranquilamente. Como é baseado em web, nada mais natural.

Então se quiser incorporar o código de vídeos de Youtube, por exemplo, é uma possibilidade de uso.

Basta jogar o código HTML – como fizesse com os marcadores do Twine – e ele entenderá normal.

 

Desafio para o Próximo Tutorial

Agora que vimos um pouco de formatações, imagine que eu quero que todas as passagens tenham a fonte Arial como padrão. Como posso fazer isso, usando CSS?

Dica para saber qual atributo CSS se muda a família da fonte: CSS FONT.

Tem duas formas: um jeito trabalhoso (já ensinado nesse tutorial – CSS em Linha) e um mais fácil, cujo tema será o do próximo tutorial. Tente descobrir.

 

 

Nesse tutorial vimos as possibilidades de formatação do texto no Twine. Aprendemos os marcadores da própria ferramenta, um pouco de CSS aplicado a um trecho do texto, além de que podemos usar o HTML para formatar nossos jogos/histórias.

Próximo tutorial veremos trabalhar com folhas de estilo para se aplicar a toda a história, os Stylesheets. Assim, você padroniza tudo e fica bem mais fácil.

Abraços e até mais. 🙂

Fabiano Naspolini de Oliveira

Fabiano Naspolini de Oliveira

Fabiano Naspolini de Oliveira (Editor-Chefe) – Formado em Análise e Desenvolvimento de Sistemas, Pós-Graduado em Docência para Educação Profissional, MBA em Game Design e Mestrado em Tecnologias da Informação e Comunicação. Foi redator do portal Nintendo Blast, professor de cursos técnicos e Game Designer/Sócio-Fundador do estúdio Céu Games por 6 anos. Atualmente, é professor de jogos digitais e escritor.

Send this to a friend