UNIVERSIDADE DO ESTADO DE EBONYI

ABAKALIKI

DEPARTAMENTO DE CIÊNCIA DA COMPUTAÇÃO

RELATÓRIO DE SEIS MESES SOBRE O ESQUEMA DE EXPERIÊNCIA

DE TRABALHO INDUSTRIAL DE ESTUDANTES (SIWES)

NO
LISTACC LIMITED ,
3º ANDAR, INVESTIMENTO DREAMLINK, MILHAS 50 ABAKALIKI,
ESTADO DE ÉBÔNIO.

ALUKO OLUWATOYOSILORUN OLAIDE

EBSU/2017/88889

SUPERVISOR DO SIWES:
MAZI VINCENT ESOMCHI

Maio de 2021.
 APRESENTADO EM CUMPRIMENTO PARCIAL DOS REQUISITOS
PARA A CONCESSÃO DO GRAU DE BACHARELADO EM CIÊNCIAS
(B.Sc), NA FACULDADE DE CIÊNCIAS, DA EBONYI STATE
UNIVERSITY,
ABAKALIKI.

DEDICAÇÃO

Este relatório é dedicado principalmente a Deus Todo-Poderoso, depois aos meus

pais e irmãos pelo seu amor e apoio e também à minha amiga Mercy Amah, ela é

enviada por Deus e a todos os outros que contribuem para o sucesso do meu

treinamento SIWES.
 RECONHECIMENTO

O meu apreço vai para o Fundo de Formação Industrial pela sua visão na

implementação deste programa.

Sou grato à Listacc Tech Academy por me fornecer as habilidades necessárias para

ser exposto em minha área. Também quero agradecer muito ao meu supervisor do

setor, Sr. Vincent Esomchi. Incluindo o Sr. Kayode e o Sr. Steve, vocês são

incríveis e agradeço aos meus competentes colegas por tornarem minha estadia na

Listacc Tech Academy emocionante e feliz.

Estou profundamente grato a Deus todo-poderoso, o doador de toda a sabedoria,

conhecimento e compreensão, sem o qual eu não teria alcançado absolutamente

nada. Finalmente, ao meu supervisor da Instituição pelo seu apoio. Obrigado a

todos, estou muito grato.

 ABSTRATO

Este relatório industrial apresenta a experiência adquirida durante meus seis (6)
meses de treinamento industrial realizado na Listacc Tech Academy, 3º andar,
investimento Dreamlink, Mike 50, Abakaliki, Ebonyi State. Meu treinamento foi
em design de interface de usuário.
Adquiri conhecimento prático sobre como projetar protótipos para sites e
aplicações.
Este relatório discute as competências técnicas adquiridas durante o período de
formação e justifica a relevância do programa para dotar os alunos das
competências técnicas necessárias para prosperar no mundo real.
 TABELA DE CONTEÚDO

Capa
Folha de rosto
Dedicação…………………………………………………………………………...1
Agradecimento……………………………………………………………………..2
Resumo…………………………………………………………………….......3
Índice …………………………………………………………….…….4

Capítulo 1
Introdução…………………………………………………………………….…..….1
Objetivo do treinamento...……………………………………………….………….……...6
Breve história de Siwes………………………….………………………….………….….......7
Órgãos envolvidos em Siwes...….………………………………………….….……….…....7
Natureza e escopo dos Siwes............................................. .................................................. ..8
Metas e objetivos de Siwes………………………………………………………….8
Benefícios do Treinamento Industrial……………………………………………….….….....8
Descrição da constituição do anexo……………………………………..9
Objetivos e visão da Listacc Tech Academy..………………………………………….......9
Área de especialização da empresa……………………………………………….….10
Departamentos da empresa…………………………………………………….....10

Capítulo 2
Experiência Industrial……………………………………………………………………2
Departamento de Treinamento em
Tecnologia………………………………………………………….........11
Definição de termos……………………………………………………………….....11
Design thinking e seus processos………………………………………………………….…...12
Teoria das Cores………………………………………………………….…...15
Estrutura de arame e ferramentas……………………………………………….….....17
Tipografia……………………………………………………......18
Fluxos de produto/usuário……………………………………..26
Botões………………………………………………………………...27

Capítulo 3
Competências adquiridas e desafios encontrados…………………………………………3
Competências técnicas adquiridas……………………………………………………...37
Habilidades sociais e funcionais adquiridas............................................. ..............................37
Contribuição pessoal para a empresa (Listacc Tech Academy)………………………………...38
Desafios encontrados………………………………………………………….…...38

Capítulo 4
Conclusão e Recomendações……………………………..…………………4
Conclusão…………………………………………………………………….....39
Recomendações…………………………………………………………............39

Referência…………………………………………………………………………..40
 CAPÍTULO 1

INTRODUÇÃO

1.0 OBJETIVO DO TREINAMENTO:

O esquema de experiência de trabalho industrial para estudantes (SIWES), popularmente

chamado de Treinamento Industrial (TI) por estudantes nigerianos, é um programa anual

elaborado pela instituição em colaboração com as indústrias para dar aos alunos a oportunidade

de obter experiência prática de trabalho em seus diversos campos de estudo ou área. de

especialização. É um esforço para preencher a lacuna existente entre as teorias de sala de aula e

as práticas em engenharia, gestão e outros programas profissionais nas instituições terciárias

nigerianas.

O treinamento é um fator chave na mudança de experiência de uma força de trabalho. O

mundo atravessa uma das piores crises económicas dos últimos tempos. Tanto a economia

desenvolvida como a em desenvolvimento estão a passar por graves crises económicas.

É através desta Formação Industrial que os sistemas educativos visam ajudar os alunos a

adquirirem aptidões, aptidões e competências adequadas, tanto mentais como físicas, bem como

equipar os indivíduos para viverem em sociedade. O foco do Fundo de Formação Industrial

(ITF) é que as indústrias dos nossos países tenham sucesso face ao actual colapso económico.

Nenhuma sociedade pode alcançar progressos significativos sem encorajar os seus jovens

a adquirirem as competências práticas necessárias. Essas competências permitem-lhes aproveitar

os recursos disponíveis para satisfazer as necessidades da sociedade. Foi neste contexto que o

SIWES, também denominado Formação Industrial (TI), foi introduzido nas instituições terciárias

nigerianas.

1.1 SIWES: (Esquema de Experiência de Trabalho Industrial para Estudantes)

Uma vez que o objectivo da nossa política nacional na educação é construir uma nação
de
forte e autossuficiente, a partir do decreto governamental nº 47 de 8 Outubro de 1971,

conforme alterado em 1990, que levou à criação do Fundo de Formação Industrial (ITF) em

1973/1974 e através da formação deste órgão (ITF), no ano 1993/1994 e através da formação

deste órgão (ITF), no ano 1993/1974 foi constituída a SIWES. Na Nigéria, a forma atual de

Educação Cooperativa é conhecida como Esquema de Experiência de Trabalho Industrial de

Estudantes (SIWES).

O Programa de Experiência de Trabalho Industrial de Estudantes (SIWES) é uma

intervenção de formação planeada e supervisionada baseada em objetivos de aprendizagem e de

carreira declarados e específicos e orientada para o desenvolvimento das competências

profissionais dos participantes. O objetivo é tornar a educação mais relevante e também unir as

disciplinas relacionadas à ciência nas instituições de ensino superior na Nigéria.

O SIWES faz parte dos padrões acadêmicos mínimos aprovados nas instituições e é um

requisito acadêmico básico com quinze (15) unidades de crédito. Este requisito deve ser atendido

por todos os alunos de diversas disciplinas antes da formatura.

1.2 ÓRGÃOS ENVOLVIDOS EM SIWES:

 Os principais órgãos envolvidos no Esquema de Experiência de Trabalho Industrial de

Estudantes são;

As instituições terciárias e o Governo Federal através do Fundo de Formação Industrial (ITF).

Outras agências de supervisão incluem:

1. Comissão Universitária Nacional (NUC)

2. Conselho Nacional de Educação Técnica (NBTE)

3. Conselho Nacional de Faculdades de Educação (NCCE)

4. Instituições terciárias (universidades, politécnicos, faculdades de educação)

1.3 NATUREZA E ESCOPO DOS SIWES:

Isso se baseia no número de semanas ou meses que o aluno deverá permanecer para sua

penhora. A duração mínima do SIWES normalmente deve ser de seis meses, vinte e quatro

semanas (24) semanas para Engenheiros e Tecnólogos Universitários. A duração total

cumulativa do vínculo durante todo o período do curso não deve, preferencialmente, ser inferior

a 240 horas em tempo integral, que ocorrerá durante o período letivo ou longa vocação.

1.4 FINS E OBJETIVOS DO SIWES:

Os objetivos específicos do SIWES foram resumidos pelo governo federal da seguinte forma:

1. Proporcionar aos alunos a oportunidade de aplicar seus conhecimentos no trabalho real e

na prática real.

2. Facilitar a transição da escola para o mundo do trabalho e potenciar os contactos dos

alunos para posterior colocação profissional.

 3. Eles também incluem o fornecimento de um programa de fixação estrutural com ênfase

em aplicações, gerenciamento e experiência prática para que os alunos apliquem os

conhecimentos adquiridos.

4. Também ajuda os alunos a adquirir habilidades práticas em outras áreas para fortalecer

seu valor profissional.

1.5 BENEFÍCIOS DO TREINAMENTO INDUSTRIAL:

Os principais benefícios para os estudantes que participam conscientemente na formação

industrial são as aptidões e competências que adquirem. Estas competências de produção

relevantes (RPS) continuam a fazer parte dos beneficiários da formação industrial como activos

vitalícios que não lhes podem ser tirados. Isto porque os conhecimentos e competências

adquiridos através da formação são internalizados e tornam-se relevantes quando necessários

para o desempenho de cargos ou funções.

1.6 DESCRIÇÃO DO ESTABELECIMENTO DO ANEXO

O estabelecimento se chama Listacc Tech Academy; é uma empresa de tecnologias de

informação e comunicação com ampla experiência em consultoria TIC. Listacc é um laboratório

de inovação tecnológica e software em Abakaliki que ajuda a facilitar o crescimento de

desenvolvedores de software, inovadores, start-ups, empresas e negócios na África. Esta grande

empresa orientada para a tecnologia constrói um ecossistema que facilita a inovação à velocidade

da luz e prepara a comunidade para desenvolvedores e fundadores de start-ups.

1.7 VISÃO E MISSÃO DA LISTACC TECH ACADEMY

Colocar soluções tecnológicas nas mãos de cada indivíduo e organização, e permanecer fiel e

dedicado a melhorar vidas e modos de vida através da aplicação de tecnologia de ponta no

fornecimento de soluções eficientes para os desafios diários das pessoas em tempo hábil.

1.8 ÁREA DE ESPECIALIZAÇÃO DA EMPRESA

Com uma equipe de engenheiros de software e programadores experientes com histórico

comprovado em negócios de informática e comunicação, a empresa oferece as seguintes amplas

áreas de especialização

1. Desenvolvimento de software

2. Implantação de infraestrutura de rede

3. Treinamento em Tecnologia

1.9 DEPARTAMENTOS DA EMPRESA

A. Operações de Desenvolvimento (Desenvolvimento de Software)

B. Finança

C. Administração

D. Academia de TIC,

E. Catering escolar

F.

CAPÍTULO 2

EXPERIÊNCIA INDUSTRIAL

2.0 DEPARTAMENTO DE TREINAMENTO TECNOLÓGICO

 Este departamento foi onde ocorreu meu Treinamento Industrial onde fui fundamentado e

exposto ao mundo do design principalmente a criação de protótipos de interfaces mobile e web

me acompanhando passo a passo com praticidade durante todo o processo.

2.1 DEFINIÇÃO DE TERMOS

A seguir estão os termos que foram utilizados, na minha opinião

INTERFACE DE USUÁRIO:

Uma interface de usuário é o ponto de interação entre o usuário e um dispositivo ou produto

digital – como a tela sensível ao toque do seu smartphone ou o touchpad que você usa para

selecionar o tipo de café que deseja da máquina de café. Em relação a sites e aplicativos, o

design da UI considera a aparência, a sensação e a interatividade do produto. Trata-se de garantir

que a interface do usuário de um produto seja a mais intuitiva possível, e isso significa

considerar cuidadosamente cada elemento visual e interativo que o usuário possa encontrar. Um

designer de UI pensará em ícones e botões, tipografia e esquemas de cores, espaçamento,

imagens e design responsivo . É responsável por transferir o desenvolvimento, a pesquisa, o

conteúdo e o layout de um produto em uma experiência atrativa, orientadora e responsiva para os

usuários.

PROJETO DE EXPERIÊNCIA DO USUÁRIO:

O design da experiência do usuário é uma forma de projetar produtos que prioriza o ser

humano. Don Norman, cientista cognitivo e cofundador da Nielsen Norman Group Design

Consultancy, é responsável por cunhar o termo “experiência do usuário” no final da década de

1990. Veja como ele descreve:

“A experiência do usuário abrange todos os aspectos da interação do usuário final com a

empresa, seus serviços e seus produtos.”

– Don Norman, Cientista Cognitivo e Arquiteto de Experiência do Usuário. UX Design abrange

toda e qualquer interação entre um cliente potencial ou ativo e uma empresa. Como processo

científico, poderia ser aplicado a qualquer coisa; lâmpadas de rua, carros, estantes Ikea e assim

por diante. No entanto, apesar de ser um termo científico, a sua utilização desde o início tem sido

quase inteiramente dentro dos domínios digitais; uma razão para isso é que a indústria de

tecnologia começou a explodir na época da invenção do termo.

Essencialmente, a UX se aplica a qualquer coisa que possa ser experimentada – seja um site, uma

máquina de café ou uma visita ao supermercado. A parte “experiência do usuário” refere-se à

interação entre o usuário e um produto ou serviço. O design da experiência do usuário, então,

considera todos os diferentes elementos que moldam essa experiência. Um designer UX pensa

em como a experiência faz o usuário se sentir e como é fácil para o usuário realizar as tarefas

desejadas. O objetivo final do design UX é criar experiências fáceis, eficientes, relevantes e

agradáveis para o usuário.

PROTÓTIPO:

Protótipo é literalmente o primeiro projeto de algo

2.2 DESIGN THINKING E SEUS PROCESSOS

Design thinking é o conjunto de processos cognitivos, estratégicos e práticos pelos quais

são desenvolvidos conceitos de design (propostas de produtos, edifícios, máquinas,

comunicações, etc.). Muitos dos principais conceitos e aspectos do design thinking foram

identificados através de estudos, em diferentes domínios de design, de cognição e atividade de

design em contextos laboratoriais e naturais.

Design Thinking é uma metodologia de design que fornece uma abordagem baseada em soluções

para a resolução de problemas. É extremamente útil para lidar com problemas complexos que
são mal definidos ou desconhecidos, ao compreender as necessidades humanas envolvidas, ao

reformular o problema de maneiras centradas no ser humano. , criando muitas ideias em sessões

de brainstorming e adotando uma abordagem prática na prototipagem e nos testes.

 Simpatize

A primeira etapa do processo de Design Thinking é obter uma compreensão empática do

problema que você está tentando resolver. Isto envolve consultar especialistas para saber mais

sobre a área de preocupação através da observação, envolvimento e empatia com as pessoas para

compreender as suas experiências e motivações, bem como mergulhar no ambiente físico para

que possa obter uma compreensão pessoal mais profunda das questões envolvidas. A empatia é

crucial para um processo de design centrado no ser humano, como o Design Thinking, e a

empatia permite que os design thinkers deixem de lado as suas próprias suposições sobre o

mundo, a fim de obter insights sobre os usuários e suas necessidades.

Dependendo das restrições de tempo, uma quantidade substancial de informação é recolhida

nesta fase para ser utilizada durante a fase seguinte e para desenvolver a melhor compreensão

possível dos utilizadores, das suas necessidades e dos problemas subjacentes ao desenvolvimento

desse produto específico.

 Defina o problema)

Durante o estágio Definir, você reúne as informações que criou e reuniu

durante o estágio Empatia. É aqui que você analisará suas observações e as

sintetizará para definir os principais problemas que você e sua equipe

identificaram até o momento. Você deve procurar definir o problema como

uma declaração de problema de maneira centrada no ser humano. O estágio

Definir ajudará os designers de sua equipe a reunir grandes ideias para

estabelecer recursos, funções e quaisquer outros elementos que lhes

permitirão resolver os problemas ou , no mínimo, permitem que os próprios

usuários resolvam os problemas com o mínimo de dificuldade.

 Idealizar

Durante a terceira etapa do processo de Design Thinking, os designers estão prontos para

começar a gerar ideias. Você passou a entender seus usuários e suas necessidades no estágio

Empatia, e analisou e sintetizou suas observações no estágio Definir, e terminou com uma

declaração de problema centrada no ser humano. Com esse histórico sólido, você e os membros

de sua equipe podem começar a "pensar fora da caixa" para identificar novas soluções para a

definição do problema que criaram e podem começar a procurar formas alternativas de visualizar

o problema. Existem centenas de técnicas de Ideação, como Brainstorm, Brainwrite, Worst

Possible Idea e SCAMPER. As sessões de Brainstorm e Pior Ideia Possível são normalmente

usadas para estimular o pensamento livre e expandir o espaço do problema. É importante obter o

máximo possível de ideias ou soluções de problemas no início da fase de Ideação. Você deve

escolher algumas outras técnicas de Ideação ao final da fase de Ideação para ajudá-lo a investigar

e testar suas ideias, para que possa encontrar a melhor maneira de resolver um problema ou

fornecer os elementos necessários para contorná-lo.

 Protótipo

A equipe de design produzirá agora uma série de versões baratas e reduzidas do produto ou de

recursos específicos encontrados no produto, para que possam investigar as soluções de

problemas geradas no estágio anterior. Os protótipos podem ser compartilhados e testados dentro

da própria equipe, em outros departamentos ou em um pequeno grupo de pessoas fora da equipe

de design. Esta é uma fase experimental e o objetivo é identificar a melhor solução possível para
cada um dos problemas identificados nas três primeiras etapas. As soluções são implementadas

dentro dos protótipos e, uma a uma, são investigadas e aceitas, melhoradas e reexaminadas ou

rejeitadas com base nas experiências dos usuários. Ao final desta etapa, a equipe de design terá

uma ideia melhor das restrições inerentes ao produto e dos problemas que estão presentes, e terá

uma visão mais clara de como os usuários reais se comportariam, pensariam e se sentiriam ao

interagir com o produto final. produtos.

 Teste

Os designers ou avaliadores testam rigorosamente o produto completo utilizando as melhores

soluções identificadas durante a fase de prototipagem. Esta é a fase final do modelo de 5 fases,

mas num processo iterativo, os resultados gerados durante a fase de testes são frequentemente

utilizados para redefinir um ou mais problemas e informar a compreensão dos utilizadores, as

condições de utilização, como as pessoas pensam , comportar-se, sentir e ter empatia. Mesmo

nesta fase, alterações e refinamentos são feitos para descartar soluções de problemas e obter um

entendimento o mais profundo possível do produto e de seus usuários.

2.3 TEORIA DA COR

A teoria das cores é a tradição de misturar e combinar cores para ajudar a defini-las e

explicar como elas se relacionam entre si. A teoria das cores foi desenvolvida pela primeira vez

por Leonardo da Vinci e Isaac Newton.

2.3.1 CATEGORIAS DE COR

A seguir estão as várias categorias de cores

1. Cores primárias

2. Cores secundárias

3. Cores Terciárias
 Existem regras que podem ser aplicadas à roda para encontrar cores complementares ou

contrastantes.

As cores complementares são opostas no círculo cromático, as cores analógicas estão

lado a lado, as cores triádicas são igualmente espaçadas.

2.3.2 RODA DE CORES

Uma roda de cores ou círculo de cores[1] é uma organização ilustrativa abstrata de tons

de cores em torno de um círculo, que mostra as relações entre cores primárias, cores secundárias,

cores terciárias, etc.

2.3.3 POR QUE A COR É TÃO IMPORTANTE?

A cor influencia como nos sentimos

 Vermelho significa Paixão, Amor, Raiva, Fogo, Sorte

 Laranja representa Criatividade, Energia, Mudança

 Amarelo conota esperança, luz do sol, felicidade, alegria

 Verde denota novos começos, saúde, crescimento, inveja, ingenuidade

 Azul significa Confiança, Paz, Força

 Roxo pode significar Luxo., Riqueza, Imaginação

2.3.4 CONSIDERAÇÕES PARA ESCOLHER CORES PARA SEU PROJETO

1. Que história você está contando?

2. É uma jornada que muda ao longo do caminho?

3. O que você quer que o público sinta?

4. Quem é o seu público?

5. Combina, complementa ou contraria a sua marca?

 2.3.5 PROPRIEDADES DA COR

1. Matiz

Matiz refere-se ao nome real da cor, como Vermelho, Amarelo, Laranja, Azul e Verde, etc. Há

uma diferença entre o nome do matiz e o nome da cor. O nome do matiz de uma cor é mais

distinto e claro do nome da cor. Por exemplo, o nome da tonalidade do céu é 'azul celeste',

enquanto o nome da cor é “azul”. O nome da tonalidade do fogo é 'dourado', enquanto o nome da

cor é 'chama'.

2. Valor

O valor é a claridade ou escuridão da cor. Uma cor tem tantos valores que variam do claro ao

escuro. O valor mais claro de todas as cores é o branco e o valor mais escuro é o preto. Preto,

branco e cinza são cores neutras. Entre o branco e o preto existem vários valores que são

conhecidos como 'valor médio' ou 'valores normais'. O valor claro da cor é denominado 'matiz' e

o valor escuro como 'sombra'.

Por exemplo, a tonalidade da cor vermelha é 'rosa', enquanto a tonalidade é 'marrom'. Para obter

o valor claro de uma cor, adiciona-se o branco e, para obter o valor escuro, mistura-se o preto.

Todas as cores têm vários valores. O branco também é conhecido como o valor mais alto, pois

nenhum matiz é tão claro quanto o branco. Preto é o valor mais baixo, pois nenhum matiz é tão

escuro quanto o preto. Os valores claros aumentam o tamanho do objeto e os valores escuros o

diminuem.

3. Intensidade

Intensidade é o brilho ou opacidade de uma cor. A intensidade de uma cor é geralmente obtida

misturando-a com o seu complemento e, às vezes, pela adição da cor cinza. As cores no círculo

externo da Tabela de Cores Prang são de alta intensidade e as que estão dentro dele são de baixa
intensidade. Objetos com cores de intensidade total são marcantes e brilhantes e de baixa

intensidade são sóbrios e opacos. A intensidade é maior em espaços menores, enquanto é menor

em espaços grandes.

2.4 WIREFRAMING E SUAS FERRAMENTAS

Um wireframe de site (esquema de página/projeto de tela) é um guia visual que

representa a estrutura esquelética de um site. Wireframes são criados com o propósito de

organizar elementos para melhor cumprir um propósito específico. Também ajuda trabalhar de

maneiras mínimas para começar a organizar as informações e começar a descobrir o fluxo de

uma página antes de começar a se preocupar com coisas como fontes e cores e tornar tudo

perfeito em pixels. Com wireframing, você se permite trabalhar muito rapidamente e gerar

muitas ideias.

2.5.1 IMPORTÂNCIA DO WIREFRAMING

1. Ajuda a tornar o design iterativo. O IE ajuda um designer a fazer alterações

constantemente

2. Ajuda focar na funcionalidade em vez de combinar funcionalidade e estética.

2.5.4 DIFERENÇA ENTRE PROJETOS DE BAIXA FIDELIDADE (WIREFRAMES) E

DE ALTA FIDELIDADE (HI-FI)

Os wireframes se concentram mais na estrutura ou na forma esquelética do produto e

atuam como espaços reservados, enquanto os designs de alta fidelidade fornecem detalhes como

cores e tipografia.

2.5.5 FERRAMENTAS DE WIREFRAMING

1. Excêntrico

2. Micro
 3. Figura

4. Adobe XD

5. Ilustrador Adobe

6. PowerPoint

7. Axure RP

8. UXPin

2.5.6 Ideação e Validação

Wireframing é mais do que apenas uma forma de esboçar uma ideia em seu computador.

Ele é usado com frequência porque ajuda a responder a duas perguntas comuns

enfrentadas pelos criadores de software. Estas questões podem ser divididas em 2 fases

distintas: a fase de idealização e a fase de validação.

 A fase de ideação

A primeira questão, tentar descobrir como seu produto pode resolver os problemas do

cliente, reside na fase de idealização do processo de wireframing.

É aqui que você gera o máximo de ideias possível para iterar em direção a soluções cada

vez melhores. A fase de idealização é um dos poucos lugares onde a quantidade importa tanto

quanto a qualidade. A capacidade de gerar múltiplas ideias e variações de uma única ideia

permite ver as falhas e os destaques de cada uma.

Quanto mais designs você colocar na tela, mais ideias individuais você terá para escolher. Afinal,

a raiz de “criativo” é “criar”; essa é a estratégia aqui.

Uma maneira útil de pensar sobre esta fase é inverter as convenções. Concentrar-se em criar

apenas boas ideias pode restringi-lo; em vez disso, tente criar tantas ideias ruins quanto possível.
Isso removerá bloqueios criativos e liberará você apenas para produzir. Você não chegará ao

"aha!" sem passar por "ah, não!"

Dicas para usar wireframing para idealização

 Não refine ou mergulhe muito fundo muito rapidamente. Fique bagunçado. Adicione,

adicione, adicione. Subtraia mais tarde.

 Não julgue suas ideias antes de colocá-las na página. Crie primeiro, reflita depois.

 Aprenda a pensar separadamente sobre estrutura, layout, conteúdo e funcionalidade.

 Pratique trabalhar com diferentes níveis de detalhe até encontrar a quantidade certa de

detalhes e nada mais.

 A fase de validação

A segunda questão, determinar se a solução proposta será bem-sucedida, pertence à fase de

validação do processo de wireframing.

Qualquer que seja a sua função no processo de desenvolvimento de software, faltam-lhe as

informações e o conhecimento necessários para construir a melhor solução. Você pode estar

faltando informações essenciais sobre seu cliente, ou as limitações da tecnologia, ou alguns

dados de marketing. Em qualquer caso, para refinar e otimizar sua solução, você precisa do

envolvimento de outras partes interessadas. Mostrar seus wireframes a outras pessoas permite

que validem e melhorem suas ideias.

A fase de validação não deve ser pensada como o local para obter “assinatura” ou aprovação para

começar a construir imediatamente. Se você fez tudo certo, seus wireframes devem convidar à

conversa. Se eles parecerem muito polidos e "finais", você poderá não obter um feedback muito

útil.
Wireframes devem comunicar "Aqui está o que estou pensando..." quando você os mostra, e não

"Isso é o que vamos construir". Suponha que as pessoas a quem você está mostrando seus

wireframes tenham conhecimento que pode ajudá-lo a torná-los melhores. Seu trabalho é tirar

isso deles. Você não precisa mostrar todas as suas ideias durante a fase de validação. É aqui que

você pode restringir e focar nos melhores. Dito isto, é perfeitamente aceitável mostrar variações

de uma ideia ou até mesmo direções completamente diferentes. Isso reforça o ponto de que

wireframes são um ponto de partida para uma conversa, não um produto acabado. De qualquer

forma, você pode querer manter algumas ideias alternativas no bolso de trás, caso suas preferidas

não dêem certo. Nesta fase, é importante pensar nos wireframes como artefatos de comunicação.

O trabalho deles é ajudar outras pessoas a compreender suas ideias. Os recursos visuais são

muito eficazes para transmitir ideias, que é o verdadeiro poder dos wireframes.

Uma última coisa a considerar nesta fase é avaliar suas ideias em termos de usabilidade. Métodos

de inspeção de usabilidade e observação dos usuários testando sua solução em testes de

usabilidade ajudarão nesse sentido.

Dicas para usar wireframes para validar ideias

 Mostre uma variedade de ideias. Isso ajuda a avançar a conversa (gerando feedback útil

como "Gosto mais de A do que de B") e também prova que você pensou em seus designs.

 Prepare seus wireframes para visualização. Reserve algum tempo para limpá-los um

pouco. Vincule-os para ajudar a contar a história ou até mesmo criar versões refinadas

deles.

 Use um modo de apresentação para mostrar apenas os wireframes sem o editor ao seu

redor.
  Não deixe o wireframe falar tudo. Complemente os detalhes que faltam com suas

próprias palavras, em vez de tentar deixar o wireframe contar toda a história.

 Adicione anotações conforme necessário para visualização e compartilhamento posterior

(que podem ser desativados durante a apresentação).

2.6 TIPOGRAFIA

O design tipográfico é a arte e a técnica de organizar os tipos. Está no centro do conjunto

de habilidades de um designer e envolve muito mais do que simplesmente tornar as palavras

legíveis. O tipo de letra que você escolher e como ele funciona com seu layout, grade, esquema

de cores e assim por diante farão a diferença entre um design bom, ruim e excelente.

2.6.1 Seleção de fonte

O design da fonte é um processo longo e complicado. As fontes são criadas por artesãos durante

um período substancial de tempo, usando talentos aprimorados ao longo de muitos anos. As

melhores fontes projetadas profissionalmente vêm com vários pesos e estilos para formar uma

família completa, além de pares de kerning cuidadosamente considerados, suporte multilíngue

com caracteres internacionais e glifos alternativos expressivos para adicionar caráter e variedade

à composição tipográfica.

2.6.2 Tamanho

Todas as fontes não são criadas iguais. Alguns são gordos e largos; alguns são finos e estreitos.

Portanto, palavras definidas em fontes diferentes podem ocupar uma quantidade muito diferente

de espaço na página. A altura de cada caractere é conhecida como 'altura x' (simplesmente

porque é baseada no caractere 'x'). Ao combinar fontes diferentes, geralmente é aconselhável

usar aquelas que compartilham uma altura x semelhante. A largura de cada caractere é conhecida

como 'largura definida'. Isso abrange todo o corpo da carta, além do espaço que atua como um
buffer entre uma forma de letra e a seguinte. O método mais comum usado para medir o tipo é o

sistema de pontos, que remonta ao século XVIII. Um ponto é 1/72 polegada. 12 pontos formam

uma pica, uma unidade usada para medir larguras de colunas. Os tamanhos dos tipos também

podem ser medidos em polegadas, milímetros ou pixels.

2.6.3 Liderança

Entrelinha descreve o espaço vertical entre cada linha do tipo. Tem esse nome porque, na época

da composição tipográfica de metal, tiras de chumbo eram usadas para separar as linhas do tipo.

Para um corpo de texto legível e confortável de ler, uma regra geral é que o valor inicial deve ser

algo entre 1,25 e 1,5 vezes maior que o tamanho da fonte.

2.6.4 Rastreamento e Kerning

Kerning é o processo de ajustar o espaço entre os personagens para criar um par harmonioso. Por

exemplo, onde um 'A' maiúsculo encontra um 'V' maiúsculo, seus traços diagonais são

geralmente kerned de modo que o canto superior esquerdo do 'V' fique acima do canto inferior

direito do 'A'.

Kerning é semelhante ao rastreamento, mas não são a mesma coisa. O rastreamento é o processo

de ajustar o espaçamento de todos os caracteres em uma palavra e é aplicado uniformemente.

2.6.5 Medir

O termo 'medida' descreve a largura de um bloco de texto. Se você deseja obter a melhor

experiência de leitura, essa é claramente uma consideração importante. Se suas linhas forem

muito longas, o leitor pode facilmente se perder, enquanto um trecho muito curto interrompe

desnecessariamente a experiência de leitura.

Existem diversas teorias para te ajudar a definir a medida ideal para sua tipografia. Uma regra

prática é que suas linhas devem ter de 2 a 3 alfabetos de comprimento (ou seja, 52 a 78

caracteres, incluindo espaços).

2.6.6 Hierarquia e Escala

Se todos os tipos de um layout parecerem iguais, será difícil saber qual é a informação mais

importante. O tamanho é uma forma fundamental pela qual os tipógrafos criam hierarquia e

orientam seus leitores. Os títulos são geralmente grandes, os subtítulos são menores e o tipo de

corpo é ainda menor.

O tamanho não é a única forma de definir hierarquia – também pode ser conseguido com cor,

espaçamento e peso.

2.7 FLUXO DO PRODUTO/USUÁRIO

O conceito de fluxo no design UX foi cunhado pela primeira vez pelo psicólogo Mihaly

Csikszentmihalyi. Ele o considerou um estado mental altamente focado, onde o usuário está

totalmente imerso no que está fazendo e na tarefa que pretende realizar. Muitas vezes é

referido como estando “na zona”. Os fluxos de usuário ajudam os designers a compreender e

antecipar os padrões cognitivos de nossos usuários, a fim de criar produtos que possibilitem

esse estado de fluxo. Fluxos de usuário, fluxos de UX ou fluxogramas, como às vezes são

chamados, são diagramas que exibem o caminho completo que um usuário percorre ao usar

um produto. O fluxo do usuário descreve o movimento do usuário através do produto,

mapeando cada passo que o usuário dá – desde o ponto de entrada até a interação final.

Existem muitos caminhos diferentes que um usuário pode seguir ao interagir com um produto.

Um fluxo de usuário é uma representação visual, escrita ou feita digitalmente, dos muitos

caminhos que podem ser seguidos ao usar um aplicativo ou site. O fluxograma começa com o
ponto de entrada do consumidor no produto, como uma tela de integração ou página inicial, e

termina com a ação ou resultado final, como comprar um produto ou inscrever-se em uma conta.

A representação desse processo permite que os designers avaliem e otimizem a experiência do

usuário e, portanto, aumentem as taxas de conversão do cliente.

2.7.1 Importância do Fluxo de Usuário

Os fluxos de usuário são extremamente úteis se você precisar:

 Crie uma interface intuitiva

O principal benefício de projetar um produto onde os usuários possam entrar no clima

rapidamente é a capacidade de aumentar a probabilidade de um usuário comprar ou se inscrever

no produto do cliente. Outro benefício é aumentar a facilidade de movimentação pela sua

plataforma, garantindo que o tempo do usuário não seja desperdiçado procurando o que fazer a

seguir. É claro que muitas vezes há mais de uma rota que um usuário pode seguir para concluir a

tarefa. Os fluxos de usuários retratam esses possíveis padrões de uma forma que facilita aos

designers avaliar a eficiência da interface que estão criando.

 Avalie interfaces existentes

Para produtos que já estão em uso, os fluxogramas do usuário ajudam a determinar o que

funciona, o que não funciona e quais áreas precisam ser melhoradas. Isso ajuda a identificar por

que os usuários podem estar paralisados em determinado ponto e o que você pode fazer para

corrigir isso. Uma tela flui para a próxima? O padrão das telas faz sentido? Mapear o movimento

dentro de uma interface em formato de blueprint ajuda a ver quais opções o usuário tem em cada

página e se as rotas disponíveis ajudam o usuário a realizar uma tarefa de forma inata e sem

perder tempo.
  Apresente seu produto a clientes ou colegas

Os fluxos de usuário também comunicam facilmente o fluxo do produto às partes interessadas e

fornecem uma visão geral de como a interface que você criou deve funcionar da forma mais

eficiente. Eles fornecem um detalhamento passo a passo do que o cliente verá e fará para

comprar, fazer login, inscrever-se, etc. Ajudar sua equipe de design a visualizar como os usuários

navegarão pelo produto garante que todos estejam na mesma página, o que permite um ambiente

de trabalho mais produtivo e gratificante.

2.7.2 Tipos de fluxogramas de usuário

Os fluxos UX podem ser usados para todos os tipos de interface e web design, mas certos tipos

de fluxogramas são mais valiosos do que outros, dependendo do que você está criando. Aqui

descrevemos algumas variações do fluxo do usuário e quando usá-las.

 Fluxos de tarefas

Os fluxos de tarefas concentram-se em como os usuários viajam pela plataforma enquanto

executam uma tarefa específica. Eles geralmente mostram apenas um caminho e não incluem

várias ramificações ou caminhos como um fluxo de usuário tradicional faria. Eles são mais bem

utilizados quando a tarefa que está sendo analisada é realizada de forma semelhante por todos

os usuários. Ao utilizar fluxos de tarefas, presume-se que todos os usuários compartilharão um

ponto de partida comum e não terão variabilidade na forma como a tarefa é executada.

 Fluxos de Fio

Wireflows são uma combinação de wireframes e fluxogramas. Eles utilizam o layout de telas

individuais como elementos do diagrama. Os wireframes por si só ajudam a transmitir o layout e

o design de cada página individual, mas não têm a capacidade de comunicar o fluxo página a

página de interfaces altamente dinâmicas. Wireflows adicionam contexto de página aos fluxos de
UX, uma vez que o que os usuários veem em cada tela tem um grande impacto em sua

experiência por meio do aplicativo ou site. Wireflows são especialmente ótimos ao criar telas

móveis. O tamanho relativamente pequeno das telas móveis é facilmente usado para substituir as

formas mais abstratas dos fluxogramas.

 Fluxos de usuário

Os fluxos de usuários concentram-se na forma como seu público-alvo interagirá com o produto.

Eles enfatizam que nem todos os usuários realizam tarefas da mesma forma e podem percorrer

caminhos diferentes. Eles normalmente estão vinculados a uma personalidade e ponto de entrada

específicos. Portanto, ao usar esse tipo de fluxograma, você pode ter muitos cenários diferentes

que começam em locais diferentes. No entanto, a tarefa ou realização principal geralmente é

sempre a mesma.

2.8 BOTÕES

Embora possam passar despercebidos se forem implementados corretamente, os botões

são um elemento vital na criação de uma experiência de usuário positiva e produtiva.

Basicamente, os botões UX são links estilizados que chamam a atenção do usuário e ajudam a

direcioná-lo em uma direção específica. Os botões podem nos vincular a outras páginas ou

concluir uma ação como enviar um formulário ou fazer uma compra. Eles são frequentemente

usados como frases de chamariz (CTA) que queremos que nossos usuários concluam em nosso

site.

2.8.1 Tipos comuns de botões UX

Os botões permitem que os usuários realizem ações e façam escolhas com um único toque. Os

botões comunicam ações que os usuários podem realizar. Eles normalmente são colocados em

toda a interface do usuário do site e devem ser facilmente encontrados e identificáveis, ao mesmo

tempo que indicam claramente a ação que permitem ao usuário realizar. Na maioria dos casos,

existem 5 tipos principais de botões UX: botões de texto, fantasma, elevados, de alternância e de

ação flutuante.

 Botões de texto

Botões de texto são rótulos de texto que ficam fora de um bloco de texto. O texto deve descrever

a ação que ocorrerá se um usuário clicar ou tocar em um botão. Os botões de texto têm um baixo

nível de ênfase e normalmente são usados para ações menos importantes. Como os botões de

texto não possuem um contêiner, eles não desviam a atenção do conteúdo próximo.

 Botões fantasma

Botões delineados (geralmente chamados de botões “fantasmas”) são um avanço em

complexidade e ênfase em relação a um botão de texto no design de botão. Normalmente

indicam ações que são importantes, mas não a ação principal em uma página. Os botões

delineados devem ser exatamente isso: um contorno sem preenchimento ao redor do texto que

indica um botão action.ost

Botões delineados (geralmente chamados de botões “fantasmas”) são um avanço em

complexidade e ênfase em relação a um botão de texto no design de botão. Normalmente

indicam ações que são importantes, mas não a ação principal em uma página. Os botões

delineados devem ser exatamente isso: um contorno sem preenchimento ao redor do texto que

indica uma ação.

 Botões elevados
Botões elevados (ou “contidos”) são normalmente botões retangulares que “se levantam” da

superfície da tela por meio do uso de uma sombra projetada. A sombra ajuda a indicar que é

possível clicar ou pressionar o botão. Os botões elevados podem adicionar dimensão a layouts

predominantemente planos e destacam a funcionalidade em espaços movimentados, amplos ou

congestionados.

 Botões de alternância

Os botões de alternância são normalmente usados no design de botões por um de dois motivos:

para agrupar opções relacionadas ou para mostrar uma ação ou configuração selecionada. Para o

primeiro, apenas uma opção em um grupo de botões de alternância pode ser selecionada e ativa

por vez. Selecionar uma opção desmarca qualquer outra. Para este último, o botão de alternância

indica se uma opção está ativa ou inativa.

 Botões de ação flutuantes

De acordo com o Google, “Um botão de ação flutuante (FAB) executa a ação primária ou mais

comum em uma tela. Ele aparece na frente de todo o conteúdo da tela, normalmente como uma

forma circular com um ícone no centro.” Um FAB deve realizar uma ação construtiva, como

criar um novo item ou compartilhar o item na tela.

2.8.1 Colocação

Em relação ao posicionamento dos botões UX, tente usar layouts tradicionais e padrões de UI

padrão tanto quanto possível, pois o posicionamento convencional dos botões melhora a

descoberta. Usar um layout padrão ajudará os usuários a entender a finalidade de cada elemento

– mesmo que seja um botão sem outros significantes visuais fortes. Combinar um layout padrão

com um design visual limpo e amplos espaços em branco torna o layout mais compreensível.

2.8.2 Microcópia
A microcópia do botão UX costuma ser uma frase de chamariz que informa aos usuários qual

ação eles realizarão se clicarem no botão. A microcópia forte do CTA deve chamar a atenção dos

usuários rapidamente e levá-los direto à ação.

Para uma frase de chamariz mais eficaz, mantenha o número de palavras no mínimo. Algumas

palavras escolhidas apropriadamente são muito mais eficazes do que uma longa frase descritiva.

Além disso, usar verbos de ação e frases como “Adicionar ao carrinho” ou “Enviar” na

microcópia do CTA pode ajudá-lo a fornecer instruções fortes e diretas aos seus usuários sobre o

que fazer a seguir.

CAPÍTULO TRÊS

HABILIDADES ADQUIRIDAS E DESAFIOS ENCONTRADOS

3.0 HABILIDADES TÉCNICAS ADQUIRIDAS

Abaixo está uma lista de habilidades que adquiri durante meu treinamento industrial na

LISTACC TECH ACADEMY

 Profundo conhecimento na compreensão do design.

 Capacidade de criar protótipos com Adobe XD.

 Capacidade de criar protótipos com Figma.

 Capacidade de criar interfaces de usuário conectando pranchetas de forma lógica.

 Depurando erros e sendo criativo na organização das pranchetas.

 Instalando Adobe Xd e Adobe Illustrator.

 Capacidade de inserir, atualizar, selecionar, remover fundo de imagens.

3.1 HABILIDADES SOCIAIS E FUNCIONAIS ADQUIRIDAS

 Habilidades de comunicação aprimoradas.

 Capacidade de identificar e resolver problemas relacionados com o design da interface do

utilizador.

 Tomada de decisão, pensamento crítico, organização e planejamento.

 Capacidade de trabalhar em equipe.

 Ensino aprimorado e habilidades de aprendizagem eficazes

 Habilidade digital aprimorada

3.2 CONTRIBUIÇÃO PESSOAL PARA A EMPRESA (LISTACC TECH ACADEMY)

 Ensinar e ajudar outros alunos em suas aulas.

 Execução de tarefas para impulsionar as atividades no local de trabalho.

 Verifique e trabalhe nos sistemas dos colegas quando houver um erro.

 Ajuda na instalação de vários aplicativos de desenvolvimento para colegas.

3.3 DESAFIOS ENCONTRADOS

 Dificuldade em buscar anexo de TI.

 Ausência de taxa de transporte.

 Falta de acesso estável à conexão com a internet

CAPÍTULO QUATRO

CONCLUSÃO E RECOMENDAÇÕES
4.0 CONCLUSÃO

Meu treinamento industrial de seis (6) meses na LISTACC TECH ACADEMY foi

um enorme sucesso e um grande momento de aquisição de conhecimentos e habilidades. Através

da minha formação pude valorizar ainda mais o curso escolhido, pois tive a oportunidade de aliar

os conhecimentos teóricos adquiridos na escola com a aplicação prática dos conhecimentos aqui

adquiridos para a realização de tarefas muito importantes que contribuíram de certa forma para

minha produtividade na empresa. Minha formação aqui me deu uma visão mais ampla da

importância e relevância da Ciência da Computação na sociedade imediata e no mundo como um

todo, pois agora espero impactá-la positivamente após a formatura. Também consegui melhorar

minhas habilidades de comunicação e apresentação e, assim, desenvolvi um bom relacionamento

com meus colegas de trabalho. Também pude apreciar a conexão entre meu curso de estudo e

outras disciplinas na produção de um resultado bem-sucedido.

4.1 RECOMENDAÇÕES:

 A escola deve fornecer um local de fixação para o aluno.

 Os subsídios devem ser pagos aos alunos durante o programa, assim como o NYSC, e

não depois.

 O Supervisor deve sempre visitar o aluno mensalmente em seus diversos locais de

fixação.

REFERÊNCIA
PAPEL

 Manual do regime de experiência de trabalho industrial para estudantes 2017/2018

LINK

 https://careerfoundry.com/

 https://creativebloq.com/

 https://premiumbeat.com/

 https://invisionapp.com/

 https://interaction-design.org/

 https://www.balsamiq.com/

 https://Wikipedia.org/

 https://yourarticlelibrary.com/

ALGUNS DOS MEUS TRABALHOS