O iVProgH é mais um sistema educacional livre do LInE, implementado em HTML5 (usa fortemente JavaScript), este destinado ao ensino e aprendizagem de algoritmos e programação. O iVProgH é uma nova implementação do iVProg que é implementado em Java. Ambos iVProg dispõem de um esquema para avaliação automática de exercícios, experimente!
Esses sistemas foram desenhados a partir de um modelo visual para programação, podendo ser utilizado desde o segundo ciclo do Ensino Fundamental.

Em qualquer ambiente para codificar algoritmos, as variáveis são utilizadas para armazenar valores a serem utilizados no código. Um exemplo simples de sua utilidade é a obtenção do quadrado de um número a ser digitado pelo usuário. Ou seja, ao escrever o código o programador não sabe qual valor será digitado, assim tem que redigir seu código supondo um "local" especial para armazenar o valor a ser digitado, que é representado por uma variável.

No iVProgH, para criar uma nova variável deve-se utilizar o botão .

Inicialmente não existem variáveis disponíveis (como indicado na figura 1). Ao "clicar" a primeira vez no botão para criar variável, aparecerá uma nova variável (atualmente com nome inicial newVar0). Mas pod-se "clicar" sobre o nome da variável para alterar seu nome.

Na imagem abaixo estão 3 passos para a criação e edição dos nomes de 2 variáveis, cronologicamente da esquerda para a direita.. Na esquerda resultado após criar as 2 variáveis, seguida da imagem indicando o início da alteração do nome da primeira variável e, mais à direita, o resultado após trocar os nomes das variáveis, respectivamente, para a e b.

Fig. 2: Processo de criação e alteração de nomes de variáveis.

Outra característica importante de variáveis é o espaço que cada uma ocupa e o formato de sua representação. Isso quer dizer que cada tipo de variável utiliza uma quantidade padrão de memória (isso costuma ser expresso em bytes - agrupamento de 8 bits). Esta questão não será aprofundada aqui, pois o foco deste manual é apresentar os rudimentos da programação e o funcionamento básico do iVProgH.

Mas existe uma questão muito importante que precisa ser enfatizada: qualquer computador digital dispõe de uma quantidade finita de memória e por isso não consegue representar qualquer número. Se quiser entender a razão dessa impossibilidade, tente entender a frase seguinte, senão pule-a.

Os números inteiros são infinitos, não existindo nem um maior inteiro e nem um menor inteiro, ou dito de outra forma, dado qualquer número inteiro sempre existe um outro maior que ele e também um outro menor que ele!
Assim, suponha que cada dígito (que são: 0, 1 até 9) precise de 4 bits para ser representado e que o computador considerado tenha disponível um total de N bits. Então este computador poderia representar um número com até N/4 dígitos.
Por exemplo, um computador básico atual vem com no mínimo 2 giga-bytes de espaço em memória (RAM - Random Access Memory), o que equivale a aproximadamente 2 bilhões de bytes, resultando em 2 x 8 bilhões de bits. Assim, o maior número inteiro positivo que caberia neste computador seria um número com 2 x 8 / 4 = 16 bilhões de dígitos.
Note que um inteiro com 16 bilhões de dígitos é tremendamente maior que o inteiro 16 bilhões, pois esse último tem apenas 11 dígitos.
Então, se representarmos esse número com 16 bilhões de dígitos por X, basta multiplicá-lo por 10 que resultaria em um número com 16 bilhões e 1 dígitos, o que não caberia na memória do computador considerado, o que resultaria em erro (que usualmente é denominado por overflow).

Se estiver interessado em saber um pouquinho mais sobre esta questão de espaço-representação, siga este apontador e este apontador.

Do ponto de vista prático, no iVProgH estão disponíveis as variáveis inteiras, reais, textos e lógicas. Ao criar uma variável, como indicado na figura 2, esta "nasce" do tipo inteira. Para alterar seu tipo, pode-se "clicar" no ícone da chave inglesa, ao lado do nome da variável (e.g. newVar0) e escolhendo o tipo.

Abaixo uma imagem ilustrando como alterar o tipo da variável de nome x de inteiro para real, em 3 passos.

Fig. 3: Processo de alteração de tipo inteiro para real na variável x.

Note que na esquerda aparece x=1, enquanto na direita vê-se x=1.0000. Isso significa que a variável x será iniciada com a unidade e que o aparecimento de "ponto decimal" diferencia o tipo inteiro do tipo real, no primeiro aparece 1 e no último 1.0000. O valor inicial da variável pode ser alterado de modo análogo à alteração de seu nome, basta "clicar" sobre o número e editá-lo.

Os comandos são as difentes instruções disponíveis na linguagem. Na atual versão do iVProgH existem seis (6) diferentes comandos, explicados abaixo.
Em cada um dos 6 comando, apresentaremos uma versão sintética do comando, em uma linguagem que será apelidada de Portugol. Também será apresentado um exemplo em linguagem C.

1. Atribuição     Para atribuir valor a alguma variável. Obtém-se a imagem abaixo.
   Representação em "Portugol": x = x * x + x + 1;. Variável x receberá o valor resultante da expressão à direita (x * x + x + 1;).
   Representação em C: x = x * x + x + 1;.
   
   Fig. 4: Comando de atribuição, situação inicial. Nesse momento deve-se selecionar a variável (destacado em fundo amarelo) e depois construir a expressão aritmética que definirá a variável. Por exemplo, pode-se fazer i = i+1, significando a variável receberá o valor atual nela acrescido de uma unidade.
   Em programação a atribuição x = x*x + x + 2 deve ser entendida como: cálcula-se primeiro o valor da expressão à direita, cujo resultado final é atribuido à variável à esquerda.
2. Se verdadeiro então     Para executar comando de acordo com uma condição (expressão lógica).
   Representação em "Portugol": se (a < b) faça CMD1; senão CMD2. Se a for estritamente menor que b, execute comando CMD1, senão execute comando CMD2.
   Representação em C: if (a < b) CMD1; else CMD2;. Sendo CMD1 e CMD2 qualquer comando válido de C.
   
   Fig. 5: Comando de seleção. Nesse momento deve-se selecionar a variável (a versão corrente tem um erro: ao clicar no Selecione... deve-se pegar a opção Valor e não Variável) e seguir construindo a expressão lógica.
   Atenção, a decisão (execução do comando) ocorre durante sua execução, com os valores desse contexto. Durante a execução, a condição é avaliada, se resoltar verdadeiro o comando subordinado ao se será executado, senão será executado o comando sob o senão. Pode-se deixar qualquer um deles vazio.
   
   Exemplo: para a expressão a < b
3. Repita N vezes     Repetir todos os comandos sobordinados (sob esse) N vezes.
   Representação em "Portugol": repetir N vezes { CMD1; ...; CMK; }.
   Representação em C: for (i=0; i < N; i++) { CMD1; ...; CMK; }.
   
   
   Fig. 6: comando para repetir um número fixo de vezes (dado por uma variável ou expressão). Na parte de superior da figura 6 está a imagem obtida imediatamente após pegar comando Repita N vezes, na parte inferior após "clicar" no símbolo .
4. Enquanto verdadeiro     Outro comando de repetição, repetindo enquanto a condição for verdadeira.
   Representação em "Portugol": enquanto (CONDICAO) { CMD1; ...; CMK; }.
   Representação em C: while (CONDICAO) { CMD1; ...; CMK; }.
   
   Fig. 7: comando para repetir enquanto a condição resultar verdadeiro. Nesse comando, o bloco subordinando será repetido até que a condição de entrada deixe de ser verdadeira.
5. Leitura de dados     Comando para permitir que o usuário entre um número/texto/Verdadeiro/Falso para o programa.
   Representação em "Portugol": leia(x);. Ler um valor e armazenar em x.
   Representação em C: scanf("%d", &x);.
   
   
   Fig. 8: Comando para entrada de dados. Abaixo após definir a variável na qual o valor digitado será armazenado (x). Nesse momento deve-se selecionar a variável (destacado em fundo amarelo) e depois
6. Escrita de dados     Comando para permitir que o usuário receba uma saída do programa.
   Representação em "Portugol": escreva(x);. Escreva no dispositivo de saída padrão o valor armazenado em x.
   Representação em C: printf("%d\n", x);.
   
   
   Fig. 9: Comando para saída de dados. Na imagem inferior após definir qual variável terá seu valor impresso. Nesse momento deve-se selecionar a variável (destacado em fundo amarelo) e depois

Exercício 1: Fazer um algoritmo que solicite que o usuário digite 2 valores (inteiros), depois compute a soma dos valores digitados e por último imprima esta soma.
Solução para o Exercício 1: passos para obter o algoritmo/programa da figura 10.

• Criar 3 variáveis e renomeá-las para nomes mais significativos. Eventualmente poderia-se dispensar a variável soma e acumular a soma em a ou em b, mas o código não ficaria tão claro;
• Criar o comando leia(a); e leia(b);, para capturar e armazenar os 2 valores a serem digitados pelo usuário (seria impossível usar apenas uma, perderia-se o primeiro valor que fosse digitado);
• Criar o comando de atribuição correspondente ao comando Porgugol soma = a+b;;
• Criar o comando para imprimir a resposto, correspondente ao comando Portugol escreva(soma);;

Fig. 10: Imagem do programa para receber 2 valores digitados e imprimir sua soma.