Wizard é um componente semelhante às abas (organizador de conteúdo), porém com uma conotação de passo-a-passo, isto é, para prosseguir para a aba seguinte o usuário precisa finalizar as ações da aba atual. Isto é feito clicando no botão Avançar.

b.1) Dimensões:          

            Aba: 32px

            Círculo: 25px

            Contorno do círculo: 2px

            Distância entre o label e o círculo: 10px

            Distância entre o conteúdo e a margem superior: 30px

b.2) Cores:

            Aba atual: 2

            Abas anteriores: 4

            Abas seguintes: 5

            Aba erro: 10

            Círculo da aba atual: 2

            Linhas horizontais: 5

b.3) Textos:

             Abas: OSr/14 (8)

            Alinhamento: centralizado vert.

            Números: OSr/16 (8)

Wizard funciona basicamente como as abas, porém, com uma ordem sequencial entre as elas. Desta forma, o usuário só poderá acessar a aba 2 depois de concluir as ações da aba 1 e assim sucessivamente. Para validar a conclusão das atividades da aba atual é necessário clicar no botão Avançar. O sistema então disponibiliza o conteúdo da aba seguinte e a qualquer momento o usuário pode retornar às abas anteriores por meio do botão Retornar. O usuário pode ainda acessar as abas já disponíveis simplesmente clicando nelas.

Se houver erro em alguma aba já concluída, o sistema irá sinalizar em vermelho a aba com o conteúdo a ser retificado (consultar o tópico 5.3 que trata com mais detalhes os erros). O usuário ficará impossibilitado de concluir as ações das abas posteriores sem antes retificar a aba com erro.

A aba ativa, é sinalizada em cor azul, as abas já concluídas em cinza escuro e as abas a seguir, ficam inabilitadas, em cinza claro (veja mais detalhes sobre cores no tópico 2.2).