Logo Passei Direto
Buscar
Material
páginas com resultados encontrados.
páginas com resultados encontrados.
left-side-bubbles-backgroundright-side-bubbles-background

Crie sua conta grátis para liberar esse material. 🤩

Já tem uma conta?

Ao continuar, você aceita os Termos de Uso e Política de Privacidade

left-side-bubbles-backgroundright-side-bubbles-background

Crie sua conta grátis para liberar esse material. 🤩

Já tem uma conta?

Ao continuar, você aceita os Termos de Uso e Política de Privacidade

left-side-bubbles-backgroundright-side-bubbles-background

Crie sua conta grátis para liberar esse material. 🤩

Já tem uma conta?

Ao continuar, você aceita os Termos de Uso e Política de Privacidade

left-side-bubbles-backgroundright-side-bubbles-background

Crie sua conta grátis para liberar esse material. 🤩

Já tem uma conta?

Ao continuar, você aceita os Termos de Uso e Política de Privacidade

left-side-bubbles-backgroundright-side-bubbles-background

Crie sua conta grátis para liberar esse material. 🤩

Já tem uma conta?

Ao continuar, você aceita os Termos de Uso e Política de Privacidade

left-side-bubbles-backgroundright-side-bubbles-background

Crie sua conta grátis para liberar esse material. 🤩

Já tem uma conta?

Ao continuar, você aceita os Termos de Uso e Política de Privacidade

left-side-bubbles-backgroundright-side-bubbles-background

Crie sua conta grátis para liberar esse material. 🤩

Já tem uma conta?

Ao continuar, você aceita os Termos de Uso e Política de Privacidade

left-side-bubbles-backgroundright-side-bubbles-background

Crie sua conta grátis para liberar esse material. 🤩

Já tem uma conta?

Ao continuar, você aceita os Termos de Uso e Política de Privacidade

left-side-bubbles-backgroundright-side-bubbles-background

Crie sua conta grátis para liberar esse material. 🤩

Já tem uma conta?

Ao continuar, você aceita os Termos de Uso e Política de Privacidade

left-side-bubbles-backgroundright-side-bubbles-background

Crie sua conta grátis para liberar esse material. 🤩

Já tem uma conta?

Ao continuar, você aceita os Termos de Uso e Política de Privacidade

Prévia do material em texto

Segunda-feira, 16 de outubro de 2023.
Fundamentos sobre Design Thinking – aula 1
 
Conceitos
Na visão de Bonini e Sbragia (2011), o Design Thinking consiste em uma abordagem colaborativa de resolução de problemas, centrada no usuário, que gera inovação através de iteração e práticas criativas.
	
Proposta: 
Mudar de certa forma, o jeito como os problemas são resolvidos e, assim, inovar.
Exemplo: 
A TOTVS conseguiu melhorar a experiência do cliente através do feedback deles e da atualização constante de softwares. Assim, o produto se tornou exatamente o que o consumidor quer e precisa.
Design Thinking nos negócios
Segundo a IDEO, o processo de Design Thinking deve reunir o que é desejável do ponto de vista do consumidor com o que é tecnologicamente possível e economicamente viável do ponto de vista do negócio.
Que esse método traz vantagens para quem o pratica na área de negócios, não há dúvidas! Mas quais os principais benefícios em comparação aos métodos tradicionais de lidar com problemas?
· Foco no problema; 
· Implementação completa x protótipos;
· Economia de dinheiro e tempo;
· Interação efetiva entre empresa e cliente final.
Etapas do Design Thinking
Para se construir um Design Thinking temos que passar por 5 fases bem estruturadas dentro do processo, são elas:
· Empatia 
· Definição 
· Ideação 
· Prototipação
· Teste 
· Empatia: 
Falar com o consumidor;
Pesquisa primária;
Pesquisa secundária;
Observação.
· Definição:
Resumo do entendimento;
Personas; 
Jornada do consumidor;
Debate.
· Ideias:
Explorar soluções;
Criar muitas ideias;
Criar ideias diferentes;
Aprimorar essas ideias. 
· Protótipo:
Hora de construir;
Prototipar as ideias;
Se falhar, falhe com mínimo esforço;
Roteiro, página de inicialização.
· Teste
Teste com consumidor;
Obtenha retorno;
Simpatizar novamente;
Validação da ideia.
Duplo diamante Design Thinking
O duplo diamante é um diagrama que é formado por quatro triângulos conectados, retratando as quatro etapas do processo e levando a inovação.
 
As etapas do modelo podemos dividir em: descobrir, definir, desenvolver e entregar, organizadas em estágios divergentes e convergentes do processo de design. 
Design Thinking no desenvolvimento web
Essa metodologia não irá fazer com que mude a linguagem de programação utilizada por você ou seu modo de planejamento e organização do desenvolvimento de um website. Porém, toda essa mudança vem para fazer uma aplicação dos seus conhecimentos, entender que o foco será sempre atender as necessidades das pessoas envolvidas.
Se alguém visita um site e acha ruim, o que ela faz? Abandona o site!
Dessa forma, são grandes as chances de se perder um potencial cliente. A união de todas as práticas e elementos do Design Thinking garante a intuitividade e uma melhor compreensão de qualquer ambiente digital.
Estudo de caso
Como estimular a inovação em sua organização com o Design Thinking? 
Neste caso de uso, as cidades de Alborg e Rotterdam compartilharam suas descobertas obtidas a partir de iniciativas de Design Thinking. Isto é baseado em uma pesquisa impírica como parte de uma avaliação. O caso de uso é escrito para outros profissionais da área de design em organizações públicas. 
Queriam criar uma cultura digital inovadora, no qual os cidadãos estejam engajados e serviços mais inclusivos sejam construídos. Para isso, os municípios iniciaram diversas iniciativas com Design Thinking. Nestas iniciativas, um dos objetivos foi descobrir como Design Thinking pode nos ajudar a desenvolver serviços inovadores e inclusivos.
Terça-feira, dia 17 de outubro de 2023.
Técnicas para o Design Thinking – aula 2
Descobrindo o Design Thinking
Podemos dizer que o Design Thinking é muito mais do que simplesmente uma metodologia ou mesmo uma abordagem, ele trata de uma maneira totalmente criativa de enxergar o mundo!
O uso do Design Thinking poderia incentivar as organizações a levarem satisfação aos clientes antes de iniciarem o processo de concepção de um novo produto ou serviço (Barbosa 2016).
Definindo o Design Thinking
Quando começamos a utilizar essa metodologia do Design Thinking, passamos a entender afinco sobre as possibilidades. 
Colocando-a em pratica cria-se, na maioria das vezes um ambiente propulsor de inovação, a partir disso, vai surgindo e modelando uma nova cultura que se desenvolve e aprimora a cada implementação.
 
A empresa se torna mais ágil e mais precisa na declaração e na sugestão de soluções, focando sempre nos clientes/usuários e com propostas de novas abordagens, produtos e serviços que são mais humanos e, portanto, mais desejáveis.
Desenvolvendo Design Thinking
Quando falamos de desenvolvimento em torno do Design Thinking, ficamos com a impressão que este método nos trará muitos benefícios, não só econômicos, mas também em relação a criatividade do desenvolvimento de vários produtos de design nas diversas tecnologias, como, por exemplo, na web e mobile. 
A abordagem possui um conjunto de ferramentas que auxiliam e facilitam a geração de ideias e a inovação de produtos. São elas:
· Brainstorming;
· Workshop de co-criação;
· Cardápio de ideias;
· Matriz de posicionamento. 
Ferramenta Figma
O figma tem por característica básica o potencial de apoiar todo o processo de design do início ao fim. Traçando um passo a passo, teremos: 
· Primeiros esboços;
· Coleta de feedback;
· Colaboração;
· Protótipos prontos para teste;
· Entrega do desenvolvedor.
A entrega do Design Thinking
O uso do modelo de gestão do projeto que integra o Design Thinking e métodos ágeis pode ocorrer ao longo do ciclo do desenvolvimento do software, segundo Góes e Russo (2018):
· Como ondas entre as fases de desenvolvimento, sem nenhum sincronismo;
· Durante a etapa de concepção sincronizada com a etapa de desenvolvimento, ou;
· Com a integração do design e a construção do software em todas as etapas de desenvolvimento do software.
Embora o modelo possa ser aplicado em diferentes estágios do ciclo devida de desenvolvimento de um software, é possível identificar aspectos relevantes no uso dos modelos que integram a abordagem Design Thinking e Métodos Thinking.
Avaliando o Design Thinking
Como podemos avaliar o Design Thinking?
Essa resposta se dá quando entendemos, primeiramente, que não só as grandes empresas podem ter essa experiência com o Design Thinking. Cada vez mais, as pequenas e médias empresas estão utilizando desses conceitos colaborativos, da prática e da criação de soluções e da multidisciplinaridade na transição dos desafios nos negócios. 
Se tratando de um mundo com constantes mudanças, há necessidades de se propor melhores soluções, com mais criatividade e que melhore a experiência do cliente. Estes são fatores que não são mais opcionais, são prioritários nas empresas para se ter uma vantagem competitiva no mercado. 
Levantamento de requisitos para projetos mobile – aula 3
Introdução
Segundo Sommerville (2011), o levantamento de requisitos é feito em duas partes, sendo:
1. Os requisitos do usuário;
2. Os requisitos do sistema.
 
Requisitos do usuário
São enunciados, escritos em linguagem natural com diagramas, que referem-se aos serviços que o sistema deverá oferecer aos seus usuários e as restrições de como eles devem funcionar.
São descrições detalhadas das funcionalidades, serviços e limitações do sistema de software. O documento de requisito do sistema deve estabelecer com rigor o que deve ser implementado.
Técnicas de levantamento de requisitos
Segundo Carrizo (2008), as entevistsa, são quase sempre, o único meio utilizado para captura de informações, apesar de nem sempre ser o mais adequado para atender as necessidades dos usuários.
As entrevistas podem ser de dois tipos, fechadas ou abertas. 
Outra técnica que pode ser utilizada é a criação de cenários, que irá buscar a aproximação do mundo real às funcionalidades dos sistemas que desejamos construir.
A técnica consiste em escrever os fluxos da informação de maneira mais simples possível, visandoo entendimento das necessidades e casos específicos, que em um outro momento não foi selecionado como requisito de sistema.
 
A próxima técnica é a dos casos de uso, assim como as outras técnicas, ele é muito utilizado na fase de levantamento de requisitos, no momento da análise e do design do sistema. Nesta técnica, serão apresentadas as várias funcionalidades previstas para os sistemas e os usuários que irão utilizá-las.
Ainda temos outras técnicas, por exemplo: 
· Etnografia;
· Validação;
· Questionários;
· Prototipagem. 
Práticas para o levantamento de requisitos
Wiegers (2003), sugere 11 boas práticas para o levantamento de requisitos: 
1. Definir um processo de desenvolvimento de requisitos. 
2. Escrever um documento de visão e escopo.
3. Identificar classes de usuários e suas características.
4. Selecionar um campeão de produto para cada classe de usuário.
5. Estabelecer grupos focais de usuários típicos.
6. Trabalho com representantes dos usuários para identificar os casos de uso; grupos focais de usuários típicos.
7. Identificar os eventos do sistema e as respostas.
8. Realizar workshop de elicitação facilitados.
9. Observar os usuários realizando seus trabalhos.
10. Examinar os relatórios de problemas dos sistemas atuais para ter ideia de requisitos.
11. Reutilizar requisitos em projetos.
Requisitos funcionais: 
· Especificar ações que um sistema deve executar, sem levar em conta consideração restrições físicas;
· Melhor descrito quando são utilizados casos de uso.
RF01 – o sistema deve permitir à secretaria cadastrar cursos contendo código, descrição e coordenador;
RF02 - o sistema deve permitir à secretaria cadastrar disciplinas de cursos, contendo código, descrição, carga horária, ementa, bibliografia e pré-requisitos;
RF03 - o sistema deve permitir à secretaria cadastrar alunos, contendo matrícula, nome, endereço, telefone e curso para o qual foi aprovado;
Requisitos não-funcionais:
· Descrevem qualidades do sistema (como ele é) ao invés de suas funcionalidades (o que ele faz).
Descrição de caso de uso, matricular aluno
Descrição: este caso de uso é iniciado pela secretaria quando requisita ao sistema matricular um aluno em uma determinada turma;
Objetivo: possibilitar a matrícula de alunos em turmas;
Ator envolvido (stakeholder): secretaria;
Documentando o levantamento de requisitos
A documentação é uma atividade de registro e oficialização, que indica que ou vários documentos devem ser produzidos. A documentação apresenta muitos benefícios dentro desse cenário, sendo possível destacar:
· Melhor comunicação dos requisitos;
· Uma maior redução e relação ao esforço do desenvolvimento;
· Uma maior realidade de informações para as estimativas; 
· Também é uma boa base concreta para executar a verificação e validação.
A documentação de requisitos descreve qual é o propósito do sistema, descreve também o domínio do problema, além dos requisitos funcionais e não funcionais e as regras do negócio.
quinta-feira, 19 de outubro de 2023.
Trabalhando com o método Kanban – aula 4
O que é o método Kanban?
O Kanban é uma abordagem para gerenciamento de mudanças organizacionais, não é um processo de desenvolvimento de produtos multimídia ou gerenciamento de projetos.
O Kanban é uma abordagem para a introdução de mudanças no ciclo de vida do desenvolvimento de produtos multimídea ou metodologia de gerenciamento de projetos. 
Gestão do Kanban
Na gestão do trabalho em processo com Kanban, mostra-se que, quanto mais trabalho em andamento é gerenciado ao mesmo tempo, menor são os índices de qualidade, que diminuem drasticamente.
Na produção de projetos multimídea, aumentar o trabalho em andamento envolve aumentar o número de erros que este projeto terá como consequência da pouca capacidade de concentração que os desenvolvedores poderão dedicar às tarefas.
As quatro etapas do Kanban
1. Preparar a equipe
Nesta etapa é necessário reunir todos os colaboradores que fazem parte da sua equipe e deve ser explicado como será o novo sistema de trabalho. 
2. Mapear os processos 
A segunda etapa consiste no mapeamento de processos, é neste momento que deverá ser mapeado todos os processos que serão executados pela equipe de trabalho, assim, sabendo quais colunas serão necessárias para dar conta de entender e traduzir todos os status pelos quais uma tarefa deverá passar.
3. Definir o esquema de cores e priorização 
Precisando estabelecer a comunicação entre todos os colaboradores, deve-se definir um modelo de priorização, ou seja, indicar se uma tarefa terá urgência em sua entrega.
4. Avaliar para melhorar
Assim temos em todas as adaptações, o Kanban também pode trazer alguns desafios e mesmo muitas dificuldades para toda a equipe, por este motivo é muito importante fazer uma avaliação sobre a opinião da equipe sempre pensando na melhoria de todo o processo.
Kanban e desenvolvimento ágil
Com o surgimento do Kanban, a entrega dos produtos acabou ganhando uma maior agilidade e precisão. Com isso, as empresas foram capazes de garantir um nível de qualidade muito mais uniforme para toda sua cadeia operacional, aumentando a competitividade no mercado. 
As quatro etapas do Kanban
· Aplicações do Kanban nas áreas de: desenvolvimento de software e sistemas móveis, onde conseguiu criar um ambiente mais flexível e ágil.
· Atuação do time de trabalho: em um ambiente de desenvolvimento de software ágil, os times irão atuar com alta integração, fazendo a troca de dados e buscando as soluções para os problemas de forma mais colaborativa possível. 
Kanban e Scrum
Além da metodologia Kanban, outra forma de reduzir o desperdício nos processos de desenvolvimento e também, aplicar uma pratica de metodologias ágeis, é trabalhando com Scrum. Com essas duas possibilidades, alguns gestores ficam na dúvida para saber qual deles ira aplicar dentro da sua realidade, ou seja, dentro, dentro do próprio projeto. 
Diferenças entre as duas metodologias ágeis:
Scrum
Scrumban
Seria a mistura do Scrum e Kanban utilizando os quadros durante as sprints do Scrum.
Vantagens do método Kanban
1. Traz autonomia para a equipe;
2. Prioriza tarefas;
3. Aumenta a produtividade;
4. Reduz os custos;
5. Incentiva a colaboração.
Autonomia: o responsável pelo processo tem uma facilidade através da gestão visual, ou seja, quando olha para o quadro, é fácil identificar os status das entregas e o que ainda precisa ser feito.
Priorização de tarefas: como já indicado podemos fazer priorização de das tarefas por sistemas de cores ou até mesmo o responsável pela equipe, no caso o gestor pode lançar o Kanban.
Aumento da produtividade: esse fator se dá quando aumentamos o foco e a equipe passa a ter mais clareza sobre o que precisa ser entregue e quando precisa ser entregue, tornando as tarefas mais fáceis. 
Redução de custos: aplicando o quadro Kanban, fica mais fácil gerenciar o tempo que toda a equipe vai levar em cada tarefa.
sexta-feira, 20 de outubro de 2023.
Usabilidade de softwares na prática – aula 5
Importância da usabilidade e navegação
Usabilidade: a usabilidade de um site é uma de suas principais características e traz a facilidade de uso do mesmo. Assim, o projeto de website deve ser de acordo com as necessidades dos usuários. 
Navegabilidade: o usuário deve navegar nas diversas páginas do site sem ter muita dificuldade ou sem perder transições de páginas. O site precisa fornecer para o usuário uma excelente comodidade através desta navegabilidade e, principalmente, fazer com que ele consiga encontrar as informações que busca com poucos cliques.
Pilares da usabilidade
Em usabilidade deve-se seguir e implementar com eficiência os 5 pilares.
Aprendizagem (easy to learn): para que nós possamos medir o nível de facilidade, temos que aprender a curva de aprendizado necessária, ou seja, o tempo para que o usuário consiga entender e, assim, desenvolver o que foi proposto sem muitas dificuldades.
Eficiência (efficient): no pilar da eficiência, depois do primeiro contato com a aplicação, agoraé preciso fazer uma avaliação para entender se as atividades que os usuários realizaram fpram efetivamente e facilmente memorizadas. Precisa verificar também se as mesmas podem ser desempenhadas com facilidade, não havendo assim, a necessidade de consultar a documentação de auxílio por exemplo. 
Tolerante a erros (error tolerant): uma situação avaliativa que também é muito necessária, são os erros que podem acontecer durante a utilização da aplicação por parte do usuário. 
Efetivo (effective): em relação ao efetivo, vai demonstrar uma avaliação de como o usuário se comporta dentro da aplicação depois de ficar algum tempo sem fazer nenhum uso da mesma. 
Satisfação (engaging): esse nível de avaliação também é importante medir, pois saberemos avaliar o quanto os usuários acharam a interface da aplicação amigável e, consequentemente, se estão satisfeitos com as funcionalidades e o design que apresenta.
Métrica de usabilidade
Muitas diretrizes de usabilidade foram criadas em várias áreas e o aplicativo de dispositivos moveis também está incluído, não há muitos trabalhos publicados em relação à usabilidade de diretrizes que surgem junto com a métrica.
 
A métrica de usabilidade para experiência do usuário (UMUX) é uma escala Likert de quatro itens, usada para a avaliação subjetiva de um aplicativo.
A métrica de usabilidade para Experiência de Usuário é compacta o suficiente para servir como módulo de usabilidade em uma métrica mais ampla de experiência do usuário.
Prototipagem de softwares
Existem 4 principais metodologias de prototipagem que complementam os sistemas tradicionais no ciclo de vida de desenvolvimento de software em uso hoje. São eles:
· Ilustrativo: produz apenas maquetes de relatórios e telas.
· Simulado: simula algum sistema, mas não usa dados reais ou um banco de dados, modelo não implementado.
· Funcional: executa algum sistema real, funções e usa dados reais e/ou um banco de dados, modelo não implementado.
· Evolucionária: produz modelos que se tornam parte de um sistema operacional final.
 
Mapa de calor na usabilidade
No domínio da avaliação da usabilidade na web, os mapas de calor são frequentemente usados para exibir áreas digitalizadas com frequência na web pelos visitantes, conforme indicado por Arroyo (2006).
Mapas de calor podem ser usados para otimizar o conteúdo da tela, também podem ser aplicados para identificar elementos de interface de usuário não utilizados, como botões. 
Ou podem ajudar a reorganizar o conteúdo na tela, revelando o uso incomum ou frequente de gestos (por exemplo, rolagem e arremesso), para que o conteúdo importante do aplicativo possa ser localizado na parte superior da tela.
Ferramentas para usabilidade
Quando falamos de ferramentas para usabilidade, nos reportamos as tarefas que elas irão executas, por exemplo, testar a eficiência, satisfação do site, sua eficácia e a capacidade dos usuários de executar e bater as metas.
Algumas ferramentas de usabilidade
Crazy Egg: simula uma espécie de mapa de calor que vai indicar quando e onde os usuários vão clicar no alicativo com mais frequência.
Koncept: se trata de um conjunto de ferramentas que irão testar a usabilidade de algumas soluções em smartphones, tablets e desktops. Nesta ferramenta também aplicamos o mapa de calor e existe também a possibilidade de fazer o rastreamento das tarefas e das sessões dos usuários. 
OutSprung: através do OutSprung é possível inserir o endereço (URL) do seu site e, após essa inserção, uma pessoa responsável de nível especialista envia um vídeo (screencast) com feedbacks, comentários e orientações para fazer as verificações.
UserTesting: em relação a esta ferramenta, iremos coletar informações dos usuários através de videoconferência. Essa coleta de informações geralmente dura em torno de cinco minutos.
sábado, 21 de outubro de 2023.
Projetando a navegabilidade da interface gráfica – aula 6 
Elementos de navegabilidade da interface gráfica
A grande verdade é que usuários não gostam de ler longos e densos manuais, fazer diversos cursos ou mesmo passar horas para a prender a operacionalizar algo.
Por isso dizemos que uma boa navegação é a chave de sucesso para um profissional de UX e SEO e, claro, para todos os profissionais que estão envolvidos no negócio.
Quando avaliamos a interface gráfica, seguimos alguns conceitos genéricos como “eficácia, eficiência e satisfação com as quais usuários específicos atingem objetivos específicos em ambientes particulares” (International organization for standardizaion, 97).
Tipos de navegabilidade e Rotas
Quando falamos em tipos de navegabilidade, encontramos varias opções, dependendo da necessidade do usuário. E, sabendo disso, podemos citar o “backtracking”, este tipo de navegabilidade irá permitir que o usuário se mova pelos nodos já visitados em uma outra ocasião.
Temos ainda outras ferramentas como “thumb nail”, os indicadores como relógios, ampulhetas, termômetros, cursores, contadores e outros recursos que irão fornecer algumas informações em ralação a navegação, como também tempo de navegação, espera, os contadores de ocorrências e diversas outras funcionalidades.
Padrões de cores para interfaces gráficas
 Para Guimarães (03), as cores irão desempenhar funções especificas que podem assim ser separadas em dois grandes grupos:
· Compreende as sintaxes e as relações taxionômicas, como: organizar, chamar a atenção, destacara, criar planos de percepção, hierarquizar informações, direcionar a leitura, etc.
· Compreende relações semânticas, como: ambientar, sinalizar, conotar e denotar. 
Quando falamos em comprovação da percepção visual, iremos remeter a um processo inteligente, podendo assim dividir em três fases, baseando-se nas capacidades e nos processos envolvidos, como mostra o quadro abaixo:
Padrões de fontes e prototipagem
A tipografia é uma parte importante da interface gráfica do usuário (GUI).
 
Nós definimos a tipografia como um sistema dinâmico de contrastes que resultam da relação do tipo (sua cor, forma, ritmo e estilo) ao seu plano de fundo.
As etapas do modelo podemos dividir em: 
· Descobris; 
· Desenvolver;
· Definir;
· Entregar.
Organizadas em estágios divergentes e convergentes do processo de design.
Prototipagem de navegabilidade de interface gráfica
O protótipo dentro de um projeto com interface gráfica não pode ser codificado diretamente, mas nesse caso você pode ter uma ação (clique) através dele, ou mesmo fazer testes com usuários finais. 
terça-feira, dia 24 de outubro de 2023.
Aplicativo PWA com TypeScript Angular – aula 7 
Criação de projetos com PWA 
Angular PW 
Os aplicativos angulares são um single page web application traduzindo “aplicativo de uma página”, ou seja, quando o estado é alterado, a página não é recarregada. 
Em vez disso, o Document Object Model (DOM) é modificado para alterar seu conteúdo. Angular implementa isso usando um esquema virtual DOM de um detector de mudança de estado, de modo que quando o estado do aplicativo é alterado, apenas o DOM é modificado para o mínimo necessário para refletir a mudança.
Aproveitamento de componentes
Para entender um pouco sobre a arquitetura de componentes temos que pensar que no Angular sempre temos um componente pai denominado app.componentes.ts esse componente tem um arquivo HTML, um arquivo de module que serve para importar as classes de dependência do projeto.
Esse componente pai pode ter vários componentes filhos geralmente se criar um componente de rotas e dentro desse componente renderizamos nossos componentes que vamos denominar páginas. 
A pasta node_modules contém os códigos das dependências do projeto você pode incluir quantas dependências forem necessárias. Geralmente se usa o NPM para adicionar uma nova dependência.
Nesse projeto vamos utilizar o modelo de rotas abaixo e vamos no decorrer da disciplina adicionar novas rotas no projeto. Uma rota é uma configuração do caminho do componente página que deve ser carregado no componente app-routing.module.ts.
Criação de componentes
Agoravamos criar um componente pai e um filho e a partir desses componentes passar informações entre eles. Utilize o comando abaixo para criar os componentes.
ng g component/home
ng g component componentes/header
segunda-feira, dia 6 de novembro de 2023.
Banco de dados para aplicativos – aula 8
SQLite
O SQLite pode ser definido como uma biblioteca de processo que implementa um banco de dados SQL autocontido, sem configuração, sem servidor e motor transacional. Seu código-fonte está disponibilizado em domínio público (open source) e, neste caso, é gratuito para fins privados e comerciais. 
Realm
O Realm Sync com o acesso à rede e a resolução de conflitos em um thread e, segundo plano do aplicativo para que a lógica permaneça a mesma, independentemente das condições da rede. O modelo de dados do Realm facilita o gerenciamento de um esquema consistente de objetos em seu banco de dados e em todas as plataformas de clientes. 
A maioria dos aplicativos moveis são dependentes de dados. Eventualmente, muitos aplicativos precisam compartilhar esses dados com outros aplicativos e com o mundo exterior. O Realm Sync é um aplicativo pronto para uso que atende a essa necessidade. O Realm Sync é constituído por 3 pilares: 
Offline-first functionality
O Realm Sync é construído com base na suposição de que a conectividade cairá. Chamamos esta funcionalidade de off-line-first. Depois de fazer alterações no realm local no dispositivo cliente, o Realm SDK envia automaticamente, assim que possível, as alterações para o servidor.
Live Objects
Possibilita que ao utilizar dados em um lugar (umaplicativel móvel por exemplo), esses dados sejam atualizados em todos os lugares. 
Conflict resolution
As alterações recebidas fora de ordem acabam convergindo para o mesmo estado no servidor e em todos os clientes. Como tal, o Realm Sync é fortemente consistente.
Firebase
É considerado uma plataforma de aplicação web que ajuda os desenvolvedores a criarem aplicativos de alta qualidade. O Firebase armazena os dados em formato JavaScript Notation (JSON), que não usa consulta para inserir, atualizar, excluir ou adicionar dados. 
Serviços que são disponibilizados pelo Firebase:
· Firebase Analytics;
· Firebase Cloud Messaging (FCM);
· Firebase Auth;
· Real-time Database;
· Firebase Storage;
· Firebase Test Lab for Android;
· Firebase Crash Reporting;
· Firebase Notifications.
Construindo banco de dados
Para construir um banco de dados no Firebase
Vamos usar todos os recursos do mesmo no Android. É muito fácil e serão utilizadas apenas algumas linhas de código!
A estrutura de dados do Firebase
 É mostrada onde handshake é o root do app e há dois filhos do mesmo, que serão o post e o user, estes têm seus filhos a partir dos nós. 
Ferramentas para administrar bancos de dados
Uma boa ferramenta de banco de dados precisa ter a capacidade de fornecer para o administrador uma área onde o mesmo poderá desenvolver seus conhecimentos através de comandos livres, que irão fazer a extração das informações que servirap para a sua avaliação e para a solução dos problemas por parte do banco de dados.
	
terça-feira, dia 7 de novembro de 2023.
Criação de API para banco de dados – aula 9
API Restfull
Uma aplicação web bem estruturada pode ser facilmente construída ao usar o Rest, muitos desenvolvedores criaram com sucesso uma base de API simples e robusta no serviço web Ajax e Restfull.
Enquanto falamos dos endpoints de APIs Rest Restfull, é possivele executar uma operação executando ‘solicitações’ e ‘respostas’. 
Se as APIs enviarem uma informação de ‘solicitação’ de um aplicativo ou servidor Web, ele receberá uma ‘resposta’. Com APIs REST, um endpoint é uma extremidade de um canal de comunicação.
Cada endpoint é um local onde as APIs REST podem acessar os recursos necessários para realizar uma função.
Métodos Get, Post, Put, Delete
Os verbos HTTP primários ou mais usados (ou métodos, como são chamados corretamente) são POST, GET, PUT e DELETE, correspondem a operações de criação, leitura e exclusão (ou CRUD), respectivamente.
	HTTP Verb
	CRUD 
	Entire Collection (e.g. /customers)
	Specifc Item (e.g. /customers/ {id})
	POST
	Create 
	201 (Created ) ‘Location’ header with link to /custumers/{id} constaining new ID 
	404 (Not Found), 409 (Conflict) If resource already exists.
	GET
	Read 
	200 (OK), listo f custumers. Use pagination, sorting and flitering to navigate big lists.
	200 (OK), single customer. 404 (Not Found), if ID not found or invalid.
	PUT 
	Update/Replace 
	405 (Method Not Allowed), unless you want to update/replace every resource in the entire collection. 
	200 (OK), or 204 (not Content). 404 (Not Found), if ID not found or invalid.
	PATCH
	Update/Modify
	405 (Method Not Allowed), unless you want to modify the collection itself. 
	200 (OK), or 204 (not Content). 404 (Not Found), if ID not found or invalid.
	DELETE
	
	405 (Method Not Allowed), unless you want to delete the whole collection—not often desirable.
	200 (OK). 404 (Not Found), if ID not found or invalid.
Implementando uma API com Ionic
Ionic é um SDK de código aberto completo pata desenvolvimento de aplicativos móveis híbridos criado por Max Lynch, Ben Sperry e Adam Bradley da Drifty Co.
Sua versão original se deu inicio no ano de 2013 e foi construída sobre o AngularJS e Apache Cordova, no entanto, sua versão mais recente foi construída como um conjunto de Web Components, permitindo que o usuário escolha qualquer estrutura de interface, como Angular, React ou Vue.js.
Ele também permite o uso de componentes Ionic sem nenhuma estrutura de interface de usuário. 
Ferramentas para consumir API
As ferramentas de teste de API permitem que os testadores verifiquem vários aspectos, incluindo:
· Se uma API estiver retornando a reposta esperada e no formato correto; 
· Se reage adequadamente aos casos extremos (falhas e entradas inesperadas); 
· Se responde com segurança a possíveis ataques de segurança; 
· O tempo que leva para entregar uma resposta. 
quarta-feira, dia 8 de novembro de 2023.
Trabalhando com GitHub – aula 10
Overview sobre versionamento 
Versionamento pode ser definido como o gerenciamento (armazenamento e recuperação) de versões de objetos.
Versionamento também pode ser utilizado como um termo para caracterizar a ação do usuário de criar várias versões do mesmo objeto. 
Dias (2016) aponta que as perguntas a serem realizadas para analisar a necessidade de um software para controle de versão, são quatro:
1. Alguém já subscreveu o código de outra pessoa por acidente e acabou perdendo as alterações?;
2. Têm dificuldades em saber quais as alterações efetuadas em um programa, quando foram feitas e quem fez? ;
3. Tem dificuldade em recuperar o código de uma versão anterior da que está em produção? ; 
4. Têm problemas em manter variações do sistema ao mesmo tempo? 
Caso alguma dessas perguntas acima tiverem um “sim” como resposta, logo se faz necessário um software para fazer o versionamento do código.
Ferramentas para GitHub
São indicadas algumas ferramentas que podem ajudar a melhorar o fluxo de trabalho do GitHub de revisão de código.
Alguns podem ser integrados diretamente no GitHub, enquanto outros funcionam como clientes de desktop autônomos.
DdevHub: é um cliente do GitHub focado em notificações, atividades e pull requests do GitHub.
Bolt (por WhiteSource): foi projetado para encontrar e ajudar a corrigir vulnerabilidades de código aberto, para fechar a lacuna entre desenvolvimento de código e segurança.
Gitpod: é um serviço baseado em nuvem para configurar ambientes de desenvolvimento prontos para codificar. Ele permite que você crie instantaneamente e remotamente um ambiente de desenvolvedor diretamente de seu navegador ou IDE de desktop.
Criação de repositório
Antes de criar um repositório, definiremos o que é um repositório. Repositório é um armazenamento virtual para projetos. Ele permite que sejam salvas versões de código que poderão ser acessadas no momento que for necessário. 
Versionamento de códigos fontesAntes de começar é preciso entender que salvar e/ou compartilhar o código que está sendo desenvolvido dentro dos diretórios de rede, não é a mesma coisa que controlar sua versão. 
Isso é apernas uma forma de disponibilizar os arquivos de trabalho para os demais membros do time, porém, abrindo o procedente para acidentes como exclusão ou sobescrita acidental de arquivos, e o pior, sem controle do histórico das modificações.
Fluxo de trabalho com Gitflow
Fundamentalmente, o fluxo do Git envolve isolar o trabalho em diferentes tipos de branches. No fluxo de trabalho do Git, existem cinco tipos diferentes de branch:
· Principal;
· Característica;
· Liberar 
· Correção;
· Desenvolver.
Criação de Releases
As releases no GitHub são uma solução completa para forneer pacotes de software em arquivos binários junto com suas notas de versão. 
Os arquivos binários são uma ótima maneira de fornecer ao usuário uma versão do software na forma de código até um determinado ponto. 
O GitHub dá controle total ao desenvolvedor sobre os lançamentos. Você pode criar versões no GitHub através de duas maneiras: 
· Através de tags já criadas.
· Criando uma versão nova/fresca. 
 
quinta-feira, dia 9 de novembro de 2023.
Arquitetura de Projetos Mobile – aula 11
Overview sobre Ionic
O Ionic é um framework HTML front-end construído sobre Angular e Cordova / Capacitor. De acordo com o documento oficial, a definição deste Ionic Open Source Framework é a seguinte:
“Ionic é uma estrutura de desenvolvimento de aplicativos moveis HTML5 voltada para criação de aplicativos moveis híbridos. Pense no Ionic como uma estrutura de interface do usuário de front-end que lida com toda a aparência e as interações de interface de usuário que seu aplicativo precisa para ser atraente”. 
Características mais importantes do Ionic:
· Angular - Inonic está utilizando a arquitetura Angular MVC para construir aplicativos de página única otimizadas para dispositivos móveis. 
· Existem outras versões que utilizam React, Vue e JavaScript, porém vamos focara somente na versão Angular.
· Componentes CSS – com a aparência nativa, esses componentes oferecem quase todos os elementos que um aplicativo móvel precisa. 
· Componentes JavaScript – estão estendendo componentes CSS com funcionalidades JavaScript para cobrir todos os elementos móveis que não podem ser feitos apenas com HTML e CSS.
· Plug-ins Cordova – os plug-ins Apache Cordova oferecem a API necessária para usar funções nativas do dispositivo com código JavaScript.
· Ionic CLI – este é o utilitário NodeJS alimentado com comandos para iniciar, construir, executar e emular aplicativos Ionic.
· Capacitor – acesso a código e recursos nativos o capacitor é nova versão do IONIC para acessar recursos nativos do App e sistema operacional.
Configurando dependências no Ionic
Primeiro, precisamos começar com uma observação sobre os requisitos mínimos para criar um aplicativo com a versão atual do Ionic. O Ionic tem como alvo dispositivos ipbre e Android (atualmente), suportando iOS7+ e Android4.1+.
No entanto, como existem muitos dispositivos Android diferentes, é possível que alguns não funcionem.
Implementando componentes
Em um sentido geral, um componente é uma implementação de um conjunto de recursos que são encapsulados por alguma forma de convenção de codificação. Em outras palavras, você pode pensar em um componente como uma maneira de isolar um recurso especifico do restante do aplicativo. 
No Ionic, existem dois tipos decomponentes, CSS e JavaScript. Os componentes CSS são implementados como um conjunto de classes que modificam um elemento para dar a ele uma aparência específica, como uma barra de cabeçalho. 
Capacitor e Cordova
 Capacitor é um cross-platform app runtime que facilita a criação de aplicativos da Web que são executados nativamente no iOs, Android, Electron e na Web. Foi criado e é mantido pela equipe Ionic. 
Cordova é um projeto de código aberto que executa aplicativoa da Web em várias plataformas.
Embora o Cordova e o Capacitor tenham algumas semelhanças, os projetos tomam decisões muito diferentes em vários pontos-chave, de modo que a experiência dos dois projetos sejam muito diferentes.
O Capacitor, lançado em 2018, utiliza muitas APIs modernas, que não estavam disponíveis quando o Cordova foi criado, em 2009.
sábado, dia 11 de novembro de 2023.
Banco de dados com Ionic e imagens – aula 12
Implementação de PWA com TypeScript
Um Progressive Web App (PWA) irá funcionar como qualquer outro aplicativo normal, mas ele possui alguns recursos adicionais e também tem muito menos problemas. 
Eles são rápidos, confiáveis e podem funcionar perfeitamente em um ambiente off-line.
Praticando com imagens
Para poder acessar a câmera e abiblioteca de fotos em dispositivos móveis com a Web, precisamos apenas de uma tag de e o elemento com a tag type=”file”. Na área de trabalho, o mesmo elemento dará acesso a um seletor de arquivos.
As imagens também servem como umn link entre o Model e a View. Além disso, como podemos querer importar apenas certos tipos de imagens, podemos restringir os tipos de arquivo que a entrada do arquivo deve aceitar usando o atributo accept.
Porém para nossa aplicação vamos utilizar o Ionic.
Adicione as seguintes dependências ao projeto:
· npm i @capacitor/core
· npm i @capacitor/câmera
· npm i @capacitor/filesystem
· npm i @capacitor/preferences
Utilizando SQLite
O uso do SQLite é recomendado onde a simplicidade da administração, implementação e manutenção são mais importantes que vários recursos de SGBDa maisvoltados para aplicações complexas. E essa simplicidade é amplamente requisitada hoje em dia. (Bicalho 2014).
Sabemos que o nuvleo da estrutura SQLite contém usuário interface, o processador de comandos SQL e a máquina abstrata (SQLite, 2019). 
Adicionando suporte para GPS IONIC – aula 13
Overview sobre GPS
 O Sistema de Posicionamento Global Navstar (GPS) é um sistema de navegação espacial para todos os climas em desenvolvimento peço de Departamento de Defesa (DoD) para satisfazerem os requisitos para as forças militares determinarem com precisão sua posição, velocidade e tempo em um sistema de referência comum, em qualquer lugar ou perto da Terra em uma base contínua. (Antônio Pestana, 2008).
O sistema global de todos os climas gerenciado pelo JPO consiste em três seguimentos:
· O segmento espacial que consiste em satélites que transmitem sinais;
· O segmento de controle direcionando todo o sistema;
· O segmento de usuário incluindo os vários tipos de receptores.
Trabalhando com GPS no Angular
Nós chamamos de “geoconfig” o uso da tecnologia de GPS pu mesmo RFID para fazer uma criação de um limite geográfico virtual. Dessa forma, permite que o software acione uma resposta quando um dispositivo móvel entra ou sai de uma área especifica. 
Capurando coordenadas GPS
Você já deve ter se deparado, ao entrar em um site qualquer, com um pop up do browser perguntando se você autoriza compartilhar sua localização.
Isso é uma funcionalidade que, a princípio, parece não ter relevância, porém, isso pode ajudar o site que você está visitando a montar um conteúdo mais assertivo no material que ele te entregará.
Salvando coordenadas no banco de dados
Esta é uma das formas fundamentais de armazenar dados geocoordenados. Os valores de latitude e longitude podem ser representados em um banco de dados SQL usando pontos decimais (graus decimais) em vez de graus (graus minutos segundos).
Dependendo da precisão que for exigida, você pode decidir quantos pontos decimais precisará para manter os valores de latitude e longitude. Essa decisão pode levar à escolha de usar float ou decimal no banco de dados SQL.
 A maioria dos bancos de dados, incluindo MySQL, já vem no seu pacote com os tipos de dados espaciais, automaticamente. Entretanto, outros como Postgres precisam de alguma configuração ou mesmo de um tipo de instalação para usar um tipo de dado espacial. 
O MySQL 8.0 por outro lado,suporta vários sistemas de referência espacial e cálculos geográficos. Isso isso significa que os SRIDs de geometrias têm significado e afetam os cálculos. 
Além disso, existem algumas melhorias notáveis com a versão 5.6, o que é benéfico para o cálculo da distância. Ele introduz a computação elipsóide em vez do plano cartesiano. 
 
segunda-feira, dia 13 de novembro de 2023.
Adicionando Push Notification – aula 14
Overview sobre Firebase
O Firebase é considerado uma plataforma de aplicação web. Isso ajuda os desenvolvedores a criarem aplicativos de alta qualidade. O Firebase armazena os dados em formato JavaScript Object Notation (JSON), que não utiliza consulta para inserir, atualizar, excluir ou adicionar dados a ele. 
Firebase Analytics
Ele fornece informações sobre o uso do aplicativo, que fornece solução de medicação e também proporciona engajamento do usuário. 
Esse recurso exclusivo permite que o desenvolverdor de aplicativos entendo como os usuários estão usando o aplicativo. Este serviço é pago. 
Firebase Cloud Messaging (FCM)
Anteriormente conhecido como Google Cloud Messaging (GCM), o FCM é uma solução multiplataforma para mensagens e notificações para Android, aplicativos da Web e iOS. Seu serviço é pago.
Autenticação do Firebase
O Firebas Auth oferece suporte a provedores de login social como o Facebook, Google, GitHub e Twitter. É um serviço que pode autenticar usuários usando apenas um código do lado do cliente e é um serviço pago. Inclui também um sistema de gestão de utilizadores através do qual desenvolvedores podem habilitar a autenticação do usuário com e-mail e login de senha armazenado no Firebase. 
 
Serviços disponíveis
· Armazenamento do Firebase: facilita a transferência de arquivos de forma fácil e segura, independentemente da qualidade de rede para os aplicativos do Firebase. É apoiado pelo Google Cloud armazenamento que é um serviço de armazenamento de objetos econômico. 
· Laboratório de testes do Firebase para Android: ele fornece infraestrutura baseada em nuvem para testar os aplicativos Android. Com uma operação, os desenvolvedores podem iniciar o teste de seus aplicativos em uma ampla variedade de dispositivos e configurações.
· Relatório de falhas: os relatórios detalhados dos erros são criados no aplicativo. Os erros são agrupados em clusters de rastreamento de pilha semelhantes e triados pela gravidade. 
· Notificações do Firebase: ele permite notificações de usuários direcionadas para aplicativos móveis desenvolvedores e os serviçoes estão disponíveis gratuitamente. 
image5.png
image6.png
image7.png
image8.png
image9.png
image10.png
image11.png
image12.png
image13.png
image14.png
image15.png
image16.png
image17.png
image1.png
image2.png
image3.png
image4.png

Mais conteúdos dessa disciplina