Design de blocos

Ao longo dos anos, a equipe do Blockly projetou muitos blocos e ajudou outras pessoas a projetar os delas. Confira a seguir algumas das lições que eles aprenderam.

Preferir blocos de alto nível

Sempre que possível, use uma abordagem de nível mais alto, mesmo que isso reduza a performance ou a flexibilidade de execução. Considere esta expressão do Apps Script:

SpreadsheetApp.getActiveSheet().getDataRange().getValues()

Em um mapeamento 1:1 que preserva todos os recursos em potencial, a expressão acima seria criada usando quatro blocos. Mas o objetivo do Blockly é mais alto e ele fornece um bloco que encapsula toda a expressão. O objetivo é otimizar para o caso de 95%, mesmo que isso dificulte os 5% restantes. O objetivo do Blockly não é substituir linguagens baseadas em texto, mas ajudar os usuários a superar a curva de aprendizado inicial para que possam usar linguagens baseadas em texto.

Recomendação: não converta toda a API em blocos.

Considere as opções de entrada do usuário

Três blocos de repetição mostrando maneiras diferentes de inserir um número: menu suspenso,
campo numérico e entrada de valor.

Há três maneiras de receber um parâmetro do usuário. Um menu suspenso é o mais restritivo e é bom para tutoriais e exercícios simples. Um campo de entrada permite mais liberdade e é bom para atividades mais criativas. Uma entrada de bloco de valor (geralmente com um bloco de sombra) oferece a oportunidade de calcular um valor (por exemplo, um gerador aleatório) em vez de apenas ser um valor estático.

Recomendação: escolha um método de entrada adequado para seus usuários.

Usar blocos condicionais e de repetição separados

Contraexemplo mostrando blocos if/then e while na mesma
categoria.

Os blocos mais difíceis para novos usuários são os condicionais e os loops. Muitos ambientes baseados em blocos agrupam esses dois blocos na mesma categoria "Controles", com a mesma forma e cor. Isso geralmente causa frustração, já que os novos usuários confundem os dois blocos. O Blockly recomenda mover condicionais e loops para categorias "Lógica" e "Loops" separadas, cada uma com uma cor diferente. Isso deixa claro que essas são ideias distintas que se comportam de maneira diferente, apesar de terem formas semelhantes.

Recomendação: mantenha as condições e as repetições separadas.

Processar um número variável de entradas

Alguns blocos podem exigir um número variável de entradas. Exemplos são um bloco de adição que soma um conjunto arbitrário de números ou um bloco if/elseif/else com um conjunto arbitrário de cláusulas elseif ou um construtor de lista com um número arbitrário de elementos inicializados. Há várias estratégias, cada uma com vantagens e desvantagens.

a) A abordagem mais simples é fazer com que o usuário componha o bloco de blocos menores. Um exemplo seria adicionar três números, aninhando dois blocos de adição de dois números. Outro exemplo seria fornecer apenas blocos if/else e fazer com que o usuário os aninhe para criar condições "else if".

Blocos de adição aninhados: 1 + (2 + 3).

A vantagem dessa abordagem é a simplicidade inicial (tanto para o usuário quanto para o desenvolvedor). A desvantagem é que, em casos em que há um grande número de aninhamentos, o código se torna muito pesado e difícil de ser lido e mantido pelo usuário.

b) Uma alternativa é expandir dinamicamente o bloco para que sempre haja uma entrada livre no final. Da mesma forma, o bloco exclui a última entrada se houver duas entradas livres no final. Essa é a abordagem usada pela primeira versão do App Inventor.

Bloco que adiciona quatro entradas de valor, sendo que a última está
vazia.

Os blocos que cresciam automaticamente não eram bem recebidos pelos usuários do App Inventor por alguns motivos. Primeiro, sempre havia uma entrada sem custo financeiro e o programa nunca estava "completo". Em segundo lugar, inserir um elemento no meio da pilha era frustrante, porque envolvia desconectar todos os elementos abaixo da edição e conectar de novo. No entanto, se a ordem não for importante e os usuários puderem se sentir confortáveis com lacunas no programa, essa é uma opção muito conveniente.

c) Para resolver o problema do buraco, alguns desenvolvedores adicionam botões +/- a blocos que adicionam ou removem entradas manualmente. O Open Roberta usa dois desses botões para adicionar ou remover entradas da parte de baixo. Outros desenvolvedores adicionam dois botões em cada linha para que a inserção e a exclusão do meio da pilha possam ser acomodados. Outros adicionam dois botões de cima/baixo em cada linha para que a reordenação da pilha possa ser acomodada.

Bloco que adiciona três entradas de valor externo e tem botões de mais e menos para
adicionar ou remover entradas.

Essa estratégia é um espectro de opções que variam de apenas dois botões por bloco até quatro botões por linha. De um lado, há o perigo de os usuários não conseguirem realizar as ações necessárias. Do outro lado, a interface está tão cheia de botões que parece a ponte da nave Enterprise.

d) A abordagem mais flexível é adicionar uma bolha de modificador ao bloco. Ele é representado como um único botão que abre uma caixa de diálogo de configuração para esse bloco. Os elementos podem ser adicionados, excluídos ou reorganizados quando quiser.

Bloco que adiciona três entradas de valor e tem um modificador para adicionar ou remover
entradas de valor.

A desvantagem dessa abordagem é que os modificadores não são intuitivos para usuários iniciantes. A introdução de modificadores requer alguma forma de instrução. Os aplicativos baseados em Blockly destinados a crianças mais novas não podem usar modificadores. Depois de aprender, eles são inestimáveis para usuários avançados.

Recomendação: cada estratégia tem prós e contras. Escolha o que for certo para seus usuários.