SISTEMA DE ENSINO 100% ONLINE

CURSO: ADS

GILDO ALVES LEAL JUNIOR

SISTEMA DE LEILÃO VIA INTERNET

Piripiri-PI
2022
 GILDO ALVES LEAL JUNIOR

SISTEMA DE LEILÃO VIA INTERNET

Trabalho apresentado à Universidade UNOPAR, como

requisito parcial para a obtenção de média semestral nas
disciplinas norteadoras do semestre letivo.

Tutor (a): Vanice Dalto

Piripiri
2022
 SUMÁRIO

1 INTRODUÇÃO.......................................................................................................3
2 DESENVOLVIMENTO...........................................................................................4
2.1 tarefa 1...............................................................................................................4
2.2 tarefa 2...............................................................................................................5
2.3 tarefa 3...............................................................................................................6
2.4 tarefa 4...............................................................................................................7
2.5 tarefa 5...............................................................................................................9
3 CONCLUSÃO......................................................................................................12
REFERÊNCIAS...........................................................................................................13
 3

1 INTRODUÇÃO

Atualmente, a tecnologia da informação é algo que traz um diferencial

competitivo para as organizações, fundamental para que estas alcancem seus objetivos,
buscando a qualidade de seus produtos e satisfação de seus clientes.
Como a maioria dos campos de empenho humano, as tecnologias projetadas para o
desenvolvimento de aplicações vem evoluindo constantemente. Dando maior ênfase à
arquitetura de software, que desde o princípio vem passando por importantes mudanças
no que diz respeito à divisão das aplicações em camadas independentes.
Depois de algum tempo, as empresas passaram a ver com outros olhos
os dispositivos móveis, dando a real importância ao aplicativo e ao o que ele oferece e
possibilita, dando ao usuário uma excelente experiência.
Mas possibilitar essa comunicação entre as pessoas e a empresa,
através de aplicativos, não é uma tarefa das mais simples. A empresa informar que a
marca já possui um aplicativo não significa que ela irá alavancar as suas vendas e
construir uma relação de fidelidade com os clientes. É alto o número de pessoas que
possuem os aplicativos das marcas e acabam esquecendo-se deles, deixando-os
inutilizados.

A caixa de diálogo Script para cada formulário permite criar e fazer a

manutenção das funções JavaScript aplicáveis a um formulário. As funções salvas na
caixa de diálogo aplicam-se apenas ao formulário que você estiver editando.
 4

2 DESENVOLVIMENTO

2.1 TAREFA 1

Elaborar um portal de Leilão para realizar as funções mostradas no

Diagrama de Casos de Uso abaixo:
Descrição das Funcionalidades:
1. Cadastrar Novo Leilão: informar a descrição do produto e o lance
mínimo.
2. Encerrar Leilão: Exibir a lista de leilões (mesma da consulta) com os
botões “EncerraLeilãor ” ao lado do produto. Ao clicar no botão , encerrar o leilão
correspondente.
3. Login: entrar no sistema com id/senha identificando o tipo do usuário
4. Logout: encerrar o sistema
5. Consultar Leilões: exibe a lista de leilões contendo a descrição do
produto, uma foto do produto e o lance atual.
6. Dar lance: Exibir a lista de leilões (mesma da consulta) com os botões
“Dar Lance” ao lado do produto. Ao clicar no botão , incluir, no leilão do produto
correspondente, um lance para o usuário logado com o lance 10% maior que o lance
atual. Atualizar a tela de consulta.
Será elaborado um portal de Leilão para realizar as funções mostradas
no Diagrama de Casos de Uso abaixo:
 5

2.2 TAREFA 2

A usabilidade é um conjunto de técnicas, recursos visuais e programação

que tornam o site intuitivo, ou seja, que as pessoas entendem facilmente como ele
funciona. Atualmente, há diversos aplicativos disponíveis na Play Store e na AppStore,
entretanto, muitos deles não alcançam o sucesso e, um dos principais motivos para isso
é a usabilidade em aplicativos mobile. 
UI é a sigla para User Interface, onde o foco do design de um aplicativo é
totalmente voltado para a estética dele. O objetivo é fazer com que o usuário daquele
aplicativo fique encantado com o que está acessando.
Dessa forma, o UI também reflete sobre as adaptações que serão feitas
para cada dispositivo, tamanho e sistema operacional diferente, sempre focando em
uma interface que agrade o usuário visualmente.
A Interface do usuário é onde as interações entre o usuário e o aplicativo
acontece. Seu principal objetivo é promover um sistema de fácil uso para os usuários.
Quando o aplicativo tem uma boa UI, o usuário tem menos dificuldades ao operar o
aplicativo e, consequentemente, sua experiência é otimizada e esses fatores são
essenciais para aumentar os downloads de um aplicativo.
Geralmente, quando falamos sobre acessibilidade, um dos primeiros
tópicos que nos vem à cabeça é a usabilidade para pessoas com deficiência. E esse é
um dos grandes impactos da acessibilidade em aplicativos mobile, tá? 
Segundo a ONU, 1 bilhão de pessoas (ou seja, uma a cada sete)
possuem algum tipo de deficiência. Olhando apenas aqui para o Brasil, o IBGE (Instituto
Brasileiro de Geografia e Estatística) indica que cerca de 24% da população é formada
por pessoas com deficiência (cerca de 46 milhões de brasileiros). 
Todo o processo de inclusão de acessibilidade deve ser contínuo no ciclo
de desenvolvimento da aplicação. Igor nos conta que, quando pensamos em maneiras
de acessibilidade, temos quatro maneiras de validar a nossa aplicação:
1. teste com ferramentas, o qual é feito com ferramentas de acessibilidade
específicas durante o desenvolvimento de cada funcionalidade;
2. testes automatizados, que são testes automáticos que garantem a integridade do
que já foi desenvolvido e certifica que as novas funcionalidades também estão
corretamente adaptadas;
3. teste manual, que é o tipo de teste em que em que pessoas desenvolvedoras e
 6

testers se colocam no papel de quem precisa de acessibilidade e tentam replicar

os principais cenários de usos para garantir que tudo que foi desenvolvido
realmente ajuda na utilização do aplicativo;
4. testes com usuários, que contam com a solicitação de feedbacks de pessoas que
necessitam de acessibilidade para uma validação mais precisa das
funcionalidades. Aqui também é possível contratar consultorias especializadas
nesse tipo de análise.
Personas são personagens fictícios realistas que refletem as
necessidades e desejos mais íntimos de seus clientes. No caso do seu aplicativo, as
personas que você criar representarão essencialmente os vários grupos de usuários do
seu aplicativo móvel. O objetivo final da criação de personas de usuário é que você e
sua equipe tenham representações rápidas e claras de com quem você estará
construindo relacionamentos.
Este processo de criação de persona é realmente usado em setores de
grandes negócios, como bens de consumo, finanças, publicidade, mídia, varejo e muitos
outros. É um processo de negócios tão importante porque permite que grandes
corporações interajam com milhões de seus clientes de maneiras altamente
relacionáveis. Mas, com o cenário móvel em constante mudança e as taxas crescentes
de uso de aplicativos móveis, criar personas para seus aplicativos móveis será um dos
processos mais cruciais que você já encontrou.
Para construir e manter um produto de sucesso, você precisa saber muito
sobre seus usuários, como suas necessidades intrínsecas, desejos, opiniões e muito
mais. Criar personas de usuário é uma das melhores maneiras de obter esse
conhecimento e, em última análise, fortalecer a experiência do usuário do seu aplicativo.
Criar uma persona é essencial para que o seu negócio tenha uma
estratégia com um foco bem definido: o seu cliente! Diferentemente do conceito de
público-alvo, que é uma ideia bem abrangente de quem seria o seu consumidor, uma
persona é uma representação bastante específica e detalhada do seu cliente ideal.

2.3 TAREFA 3

A pesquisa é uma necessidade muito básica quando você armazena

dados em diferentes estruturas de dados. A abordagem mais simples é percorrer todos
os elementos da estrutura de dados e combiná-los com o valor que você está
 7

procurando. Isso é conhecido como pesquisa linear. É ineficiente e raramente usado,

mas criar um programa para isso dá uma ideia de como podemos implementar alguns
algoritmos avançados de busca.

def busca(lista, valor):

1. navegar = lista.head
2. while navegar and navegar.data != valor:
3. navegar = navegar.nextItem
4. return navegar
Quadro 1: fragmento phyton

O código Phyton em questão consiste em buscar um valor em uma lista,

iniciando no cabeçalho da mesma. Ao passo que que percorre os elementos e esse é
diferente do valor procurado, a busca continua para o próximo item, até retornar o valor.

2.4 TAREFA 4

Formulários HTML são um dos principais pontos de interação entre um

usuário e um web site ou aplicativo. Eles permitem que os usuários enviem dados para o
web site. Na maior parte do tempo, os dados são enviados para o servidor da web, mas
a página da web também pode interceptar para usá-los por conta própria.
Um formulário HTML é feito de um ou mais widgets. Esses widgets
podem ser campos de texto (linha única ou de várias linhas), caixas de seleção, botões,
checkboxes ou radio buttons. A maior parte do tempo, estes elementos são
emparelhados com uma legenda que descreve o seu objetivo.
Antes de começar a codificar, é sempre melhor dar um passo atrás e
tomar o tempo para pensar sobre o seu formulário. Desenhando um rascunho rápido irá
ajudar a definir o conjunto correto de dados que você quer perguntar ao usuário.

<div>
<label for="username">Username:</label>
<input type="text" id="username" name="username">
</div>
 8

<div>
<label for="pass">Password (8 characters minimum):</label>
<input type="password" id="pass" name="password"
minlength="8" required>
</div>

<input type="submit" value="Sign in">

Elementos <input> do tipo "password" são uma maneira do usuário

digitar senhas com segurança. O elemento é mostrado como um controle de edição de
texto de uma linha, no qual o texto é omitido para que não possa ser lido, geralmente
substituindo cada caractere por um símbolo como o astesrisco ("*") ou um ponto ("•").
Esse caracter varia dependendo do agente de usuário e do OS.
Os detalhes de como o processo de inserção do texto funciona podem
variar dependendo do navegador. Dispositivos móveis, por exemplo, frequentemente
mostram o caractere digitado por um breve momento antes de ser ocultado, de forma
que o usuário possa verificar se realmente digitou o caractere pretendido. Isso é útil
devido ao tamanho reduzido das teclas e a facilidade de se pressionar a tecla errada,
principalmente em teclados virtuais.
Nesta tarefa será criada uma função javascript para validar um
formulário de login em HTML de maneira fácil.

function valida_login(){
    
    if(document.login.nome.value == ""){
      alert("Esse campo é obrigatório.");
      document.login.nome.focus();
      return false;
    }
    else if(document.login.senha.value == ""){
      alert("Esse campo é obrigatório. ");
      document.login.senha.focus();
      return false;
    }
 9

    else{
alert("Login realizado com sucesso. ");
      return true;
    }
  }

Quadro 2: função javascript

2.5 TAREFA 5

SQL, como todos sabemos, é a linguagem de banco de dados pela qual

podemos realizar certas operações no banco de dados existente e também podemos
usar essa linguagem para criar um banco de dados. SQL usa certos comandos como
Create, Drop, Insert, etc. para realizar as tarefas necessárias.
Esses comandos SQL são categorizados principalmente em quatro
categorias como:
DDL – Linguagem de Definição de Dados
DQl – Linguagem de Consulta de Dados
DML – Linguagem de Manipulação de Dados
DCL – Linguagem de Controle de Dados

Assim, para cumprir esta tarefa, chegamos ao script abaixo:

CREATE DATABASE ` universidade-bd `;

CREATE TABLE `Aluno` (

`id` int(11) NOT NULL AUTO_INCREMENT PRIMARY KEY,
`nome` varchar(255) COLLATE utf8_unicode_ci DEFAULT NULL,
`cpf` int(11) DEFAULT NULL,
`endereco` varchar(255) COLLATE utf8_unicode_ci DEFAULT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;
 10

CREATE TABLE `Professor` (

`id` int(11) NOT NULL AUTO_INCREMENT PRIMARY KEY,
`nome` varchar(255) COLLATE utf8_unicode_ci DEFAULT NULL,
`cpf` int(11) DEFAULT NULL,
`salario` int(11) DEFAULT NULL,
`carga_hr` int(11) DEFAULT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

CREATE TABLE `Curso` (

`id` int(11) NOT NULL AUTO_INCREMENT PRIMARY KEY,
`nome` varchar(255) COLLATE utf8_unicode_ci DEFAULT NULL,
`carga_hr` int(11) DEFAULT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

CREATE TABLE `Matricula` (

`id` int(11) NOT NULL AUTO_INCREMENT PRIMARY KEY,
`aluno_id` INT NOT NULL,
`cursos_id` INT NOT NULL,
`data_matricula` DATE NOT NULL,
`num_matricula` int(11) DEFAULT NULL,
`status_matricula` varchar(5) COLLATE utf8_unicode_ci DEFAULT NULL,
INDEX i2 (cursos_id),
FOREIGN KEY (aluno_id) REFERENCES aluno(id) ON DELETE CASCADE,
FOREIGN KEY (cursos_id) REFERENCES cursos(id) ON DELETE RESTRICT
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci;

Quadro 3: script DDL

Com respeito a consultar registros específicos em nosso banco de

dados, se desejamos exibir os dados completos de uma
matrícula, contendo nome do aluno, seu número de matrícula, o curso que está
matriculado, e assim por diante devemos trabalhar com dados de três tabelas (matrícula,
 11

aluno, curso).
Para unir as três tabelas usaremos em nosso select o JOIN:

SELECT
aluno.nome,
matricula.num_matricula,
curso.nome,
matricula.status_matricula
FROM aluno
JOIN matricula
ON aluno.id = matricula.aluno_id
JOIN curso
ON curso.id = matricula.cursos_id;
Quadro 4: consulta SQL

Como você pode ver, estamos usando a tabela ALUNO na cláusula

FROM. Então, estamos juntando com a tabela MATRICULA e, finalmente, com a tabela
CURSO. Desta forma, podemos mostrar o nome do aluno e número de matrícula junto
com os cursos que está frequentando.
 12

3 CONCLUSÃO

Com a disseminação do uso da internet nos últimos anos, a arquitetura

multi-camadas tem se tornado uma arquitetura bastante utilizada visando atender as
necessidades de sistemas de informações requeridos pelas empresas para buscar
atender seus objetivos e a satisfação de seus clientes. O objetivo principal deste
trabalho foi alcançado através da implementação de um sistema de leilão voltado para a
internet.
Cada vez mais os aplicativos se fazem presentes no cotidiano das
pessoas, se transformando em itens extremamente importantes. Acontece que, por mais
importantes que esses são, muitos deles causam problemas aos usuários, fazendo com
que estes se irritem e não o utilizem mais.

Você tem a opção de especificar funções JavaScript para vincular dois

campos em dois formulários do Criador de formulários. Quando um usuário atualiza um
campo em um formulário, o campo vinculado é atualizado simultaneamente no segundo
formulário. Basicamente, essa técnica cria uma referência cruzada automática entre os
campos nos dois formulários.
 13

REFERÊNCIAS

AP. Funções em Python. Disponível em:

https://algoritmosempython.com.br/cursos/programacao-python/funcoes/. Acesso em: 19
mar. 2022.

DEV MEDIA. O que é UML e Diagramas de Caso de Uso: Introdução Prática à UML.
Disponível em: https://www.devmedia.com.br/o-que-e-uml-e-diagramas-de-caso-de-uso-
introducao-pratica-a-uml/23408/. Acesso em: 23 mar. 2022.

DEVELOPER. O que é JavaScript? Disponível em: https://developer.mozilla.org/pt-

BR/docs/Learn/JavaScript/First_steps/What_is_JavaScript. Acesso em: 01 abr. 2022.

ROCK CONTENT. Design Thinking: uma forma inovadora de pensar e resolver

problemas. Disponível em: https://rockcontent.com/br/blog/design-thinking//. Acesso
em: 21 mar. 2022.