CONNECTYPRIME: SIMPLIFICANDO A GESTÃO DE APONTAMENTOS COM EXCELÊNCIA

REGISTRO DOI:10.5281/zenodo.10356298


Gabriel Amaral Salles de Andrade¹
Pedro Henrique Cosmo²
Thiago Alencar Inácio³
Thiago Nunes de Almeida4
Orientador: Luciana Bertolla Andrade5


Resumo: Este trabalho aborda o desenvolvimento da tecnologia ConnectyPrime, que tem como objetivo simplificar a gestão de agendamentos com excelência. A plataforma utiliza React e Web API em C# para proporcionar uma solução flexível e robusta. O ConnectyPrime foi projetado para atender às necessidades de organizações de diversos setores, oferecendo uma interface amigável e eficaz para o agendamento de compromissos.

Em um ambiente empresarial onde a eficiência e a agilidade são essenciais, o ConnectyPrime se destaca por sua capacidade de economizar tempo e recursos. Ele permite que os usuários personalizem o sistema de acordo com suas necessidades específicas, tornando-o uma solução versátil e escalável.

O trabalho analisa em detalhes a arquitetura do sistema, destacando os benefícios práticos que o ConnectyPrime oferece. Além disso, demonstra a sinergia entre as tecnologias React e Web API em C#, destacando como essa combinação melhora a eficácia da plataforma.

Por fim, o ConnectyPrime representa um avanço significativo na gestão de agendamentos, com sua simplicidade, eficiência e adaptabilidade. O trabalho lança luz sobre as capacidades dessa tecnologia inovadora e seu potencial de transformação no ambiente empresarial.

Palavras-chave: Gestão de apontamentos, React, C#, DotNet.

ConnectyPrime: Simplifying Appointment Management with Excellence

Abstract: This essay addresses the development of the ConnectyPrime technology, which aims to simplify appointment management with excellence. The platform utilizes React and Web API in C# to provide a flexible and robust solution. ConnectyPrime is designed to meet the needs of organizations across various sectors, offering a user-friendly and effective interface for appointment scheduling.

In a business environment where efficiency and agility are essential, ConnectyPrime stands out for its ability to save time and resources. It allows users to customize the system according to their specific needs, making it a versatile and scalable solution.

The essay provides a detailed analysis of the system’s architecture, highlighting the practical benefits that ConnectyPrime offers. Additionally, it demonstrates the synergy between React and Web API technologies in C#, emphasizing how this combination enhances the platform’s effectiveness.

In summary, ConnectyPrime represents a significant advancement in appointment management with its simplicity, efficiency, and adaptability. This article sheds light on the capabilities of this innovative technology and its potential for transformation in the business environment.

Keywords: Gestão de apontamentos, React, C#, DotNet

1. Introdução

Segundo Finley (1973), tanto na antiguidade quanto no início da idade média, o agendamento dos compromissos pelas pessoas era realizado de forma informal, quase que exclusivamente através da comunicação verbal, através de mensageiros ou da comunicação frente a frente. O aumento da utilização da escrita em meados da idade média até a idade moderna, no entanto, acabou por tornar mais frequente a correspondência através de cartas, o que teve forte influência na logística dos agendamentos.

Enfim, essa abordagem, por mais que tenha sido o padrão por muitos anos, sempre foi suscetível a erros, conflitos de horários e limitações significativas na capacidade de escalabilidade. No entanto, foi após essa época, no século seguinte, mais precisamente em meados da década de 1970, que o cenário tecnológico iniciou uma transformação significativa. É sabido que essa era foi marcada pelos avanços notáveis na computação e pelo surgimento de outras novas tecnologias que moldaram o mundo nas décadas seguintes. 

O advento da computação na década de 70 teve implicações diretas, também, na forma como as organizações faziam o gerenciamento de seus compromissos, pois nas décadas seguintes uma série de novas funcionalidades foram desenvolvidas para os computadores. Com o aumento da capacidade de processamento, as empresas começaram a desenvolver os primeiros softwares de organização pessoal e agendamento, tais quais o Microsoft Schedule+ (1992) e o StarOffice (1985). Assim, é possível constatar que as organizações começaram a adotar sistemas eletrônicos para gerenciar seus agendamentos. No entanto, essas soluções eram muitas vezes complexas, exigiam hardware dedicado e estavam fora do alcance de pequenas empresas.

Os Sistemas de Informação, segundo Mattos (2005), consistem em sistemas especializados no processamento e na comunicação de dados e informações. Esses sistemas são constituídos por componentes ou módulos interligados por meio de uma rede ou padrão comum, e as relações lógicas entre cada componente são definidas pelos programas executados no Sistema de Informação, de forma que as entradas sejam retroalimentadas pelas saídas, conforme a figura a seguir, exemplificando as interações entre os usuários de um sistema de agendamento de consultas médicas (figura 1).

Figura 1 – exemplo de interações entre os usuários de um sistema de agendamento de consultas médicas

Fonte: Mamun et al. (2021)

Sabendo disso, também é possível observar a vasta gama de classificações para cada Sistema de Informação. Conforme já apontado por Mamun et al. (2021), as pessoas, em sua vida cotidiana, podem utilizar, entre outros:

Sistemas de Suporte à Decisão (SSD/DSS):  construídos a fim de facilitar o processo de tomada de decisões de mercado envolvendo gestão e planejamento, baseados em dados.

Sistemas de Informações Executivas (SIE/EIS): feitos para simplificar informações executivas de modo a suportar a tomada de decisões que envolvem performance de vendas e pesquisas de mercado. 

Sistemas de Informações de Marketing (SIM/MIS): feitos a fim de facilitar a coleta, armazenamento, análise e distribuição de dados de marketing de uma empresa ou instituição.

Sistemas de Informações Contábeis (SIC/AIS): construído com o intuito de facilitar a coleta, armazenamento, análise e distribuição de dados financeiros/contábeis de uma instituição.

Sistemas de Processamento Transacional (SPT/TPS): feitos para facilitar a coleta, armazenamento, modificação e recuperação de dados de transações financeiras.

Sistemas de Controle de Estoque (SCE/ICS): utilizados para facilitar e suportar todos os aspectos envolvendo a compra, envio, recepção e rastreamento de produtos/insumos dentro de uma empresa/instituição.

Ainda segundo Mamun et al. (2021), é a partir dessas classificações que se desenvolve o conceito do Sistema de Gestão de Agendamentos/Compromissos (SGA/AMS). A gestão de compromissos e agendamentos desempenha um papel crucial em organizações de diversos setores, determinando a eficiência e a qualidade dos serviços prestados, servindo, majoritariamente, para agendamento de reuniões e datas de execução de serviços, a depender do ramo de atuação da empresa. 

Dessa forma, a tecnologia ConnectyPrime surge como um sistema de informação que representa uma resposta inovadora a esse desafio, oferecendo uma solução que simplifica e aprimora a maneira como os agendamentos são realizados. A plataforma online facilita o processo de agendamento ao proporcionar uma interface intuitiva e acessível, permitindo que os usuários marquem compromissos de forma rápida e eficiente

Neste artigo, exploramos em detalhes o desenvolvimento e as funcionalidades do ConnectyPrime, que se destaca pela combinação de tecnologias avançadas, como React e Web API em C#, para criar uma plataforma versátil e eficaz, aliviando a responsabilidade inicialmente atribuída ao HTML e CSS, trazendo mais facilidade durante todo o processo de desenvolvimento.

A agilidade e a personalização também desempenham um papel fundamental no ConnectyPrime, permitindo que os usuários adaptem o sistema de acordo com suas necessidades específicas. Além disso, o sistema é projetado para economizar tempo e recursos, tornando-se uma escolha ideal para organizações que buscam otimizar seus processos.

Ao longo deste artigo, examinaremos a arquitetura do ConnectyPrime em detalhes, destacando seus benefícios práticos e demonstrando como a sinergia entre as tecnologias React e Web API C# potencializa sua eficácia.

O ConnectyPrime representa uma mudança significativa na forma como encaramos a gestão de compromissos e agendamentos. Seu potencial transformador no ambiente empresarial é evidente, e este artigo busca lançar luz sobre as capacidades e inovações que essa tecnologia traz consigo, oferecendo, ainda, uma perspectiva preliminar sobre o futuro desta aplicação, pensando em um cenário em que seu desenvolvimento esteja completo, lançando uma luz sobre quais seriam as reais vantagens da utilização de um sistema desse tipo que seja robusto e funcional.

2. Justificativa

A gestão eficaz de compromissos e agendamentos é um fator crítico para o funcionamento eficiente de uma ampla gama de organizações e empresas em todo o mundo. Segundo Klementi et al. (2008), a tecnologia da informação desempenha um papel muito importante para a inovação no setor de serviços. Conclui-se, também, a partir disso, que a inovação trazida pela capacidade de programar e gerenciar os compromissos de forma ágil, precisa e adaptável melhora efetivamente a experiência do cliente e garante, por fim, maior eficiência operacional do serviço.

A pesquisa que descreve o estado e visa aprimorar a tecnologia ConnectyPrime surge em resposta à crescente necessidade de soluções inovadoras e altamente eficientes para a gestão de compromissos. A justificativa para este trabalho é baseada em vários motivos fundamentais.

  • Relevância atual: De acordo com Servelin et al. (2018), após análise quantitativa e qualitativa, o processo de automação/digitalização de processos, por parte de uma empresa, pode melhorar consideravelmente o processo produtivo. O ConnectyPrime, portanto, se alinha com essa tendência, na medida em que pode funcionar como a automação do processo de agendamento.
  • Necessidade de Eficiência: Conforme já mencionado acima, a eficiência no agendamento de compromissos economiza tempo e recursos para as mais diversas organizações, melhorando efetivamente a satisfação do cliente, como consequência da qualidade dos serviços prestados. 
  • Versatilidade e Adaptação: A capacidade de personalização do ConnectyPrime torna-o relevante para uma ampla gama de setores, incluindo clínicas médicas, empresas de serviços, e muitos outros, tornando-o uma solução versátil. 
  • Sustentação Tecnológica: O ConnectyPrime utiliza tecnologias avançadas, como React para a interface do usuário e Web API em C# para o backend. O React facilita a criação de interfaces modulares e reutilizáveis, simplificando a manutenção e escalabilidade do código. A Web API em C# oferece uma interface robusta para manipular solicitações HTTP, integrando-se de forma eficiente com o React. Essa combinação tecnológica fornece uma base sólida para o desenvolvimento de aplicações inovadoras no ConnectyPrime.
  • Melhoria Contínua: O aprimoramento da tecnologia é essencial para atender às demandas em constante evolução dos negócios e da sociedade em geral, e fundamenta-se no conceito de melhoria contínua. A melhoria contínua muitas vezes é impulsionada pela identificação de lacunas ou necessidades não atendidas no mercado. 

Portanto, a pesquisa voltada para o aprimoramento contínuo do ConnectyPrime se justifica não apenas pela necessidade urgente de soluções eficazes de agendamento, mas também pela sua ampla aplicabilidade em diversos setores e pelo papel fundamental que desempenha na promoção da eficiência e inovação tecnológica. 

A versatilidade do ConnectyPrime, ao atender demandas multifacetadas, reforça a importância dessa pesquisa, que busca não apenas atender, mas antecipar às exigências dinâmicas do cenário atual e futuro. 

Dessa forma, ela não apenas estabelece uma base sólida para a sustentação e validação das ideias propostas, mas também se posiciona como um catalisador para o avanço contínuo na excelência do agendamento, destacando-se como uma contribuição significativa para a evolução dos processos organizacionais em uma era cada vez mais centrada na tecnologia e na personalização das experiências.

3. Objetivo Geral

A relevância do aprimoramento da tecnologia ConnectyPrime reside na crescente necessidade das organizações modernas em otimizar seus processos de gestão. A constante evolução do cenário empresarial demanda soluções inovadoras e eficientes para enfrentar desafios complexos. Ao focar no refinamento da ConnectyPrime, busca-se proporcionar uma ferramenta mais ágil e adaptável, capaz de atender às demandas específicas de diferentes setores. 

Nesse sentido, a expansão das funcionalidades visa abranger uma gama mais ampla de necessidades, enquanto a melhoria da usabilidade pretende tornar a plataforma mais acessível a usuários de diferentes níveis de expertise. Além disso, ao maximizar a eficiência da ConnectyPrime, antecipa-se a potencialização da produtividade e a redução de custos operacionais, contribuindo assim para a excelência na gestão de compromissos e fortalecendo a competitividade das organizações em um ambiente empresarial em constante transformação. 

Com isso, o objetivo geral deste trabalho consiste em criar e projetar o aprimoramento da tecnologia ConnectyPrime, visando simplificar e otimizar a gestão de compromissos em diversas organizações e setores. Este aprimoramento envolverá a expansão das funcionalidades, a melhoria da usabilidade e a maximização da eficiência da plataforma.

3.1. Objetivos específicos

Na sequência, ainda nesse contexto, a equipe estipulou uma série de objetivos específicos a serem cumpridos, conforme a seguir:

  • Analisar a Funcionalidade Atual do ConnectyPrime: Realizar uma avaliação abrangente das funcionalidades existentes do ConnectyPrime, identificando pontos fortes e áreas que requerem melhorias;
  • Desenvolver Novas Funcionalidades: Projetar e implementar novas funcionalidades que atendam às demandas específicas dos usuários e dos setores-alvo, tornando o ConnectyPrime ainda mais versátil e adaptável;
  • Melhorar a Usabilidade: Refinar a interface do usuário e a experiência geral do usuário para garantir que o ConnectyPrime seja intuitivo e fácil de usar, promovendo a adoção generalizada;
  • Aprimorar a Eficiência Operacional: Investigar maneiras de otimizar o desempenho do sistema, reduzir tempos de espera e melhorar a eficiência operacional das organizações que utilizam o ConnectyPrime;
  • Testar e Validar as Melhorias: Realizar testes extensivos e coletar feedback de usuários para validar as melhorias implementadas, garantindo que elas atendam às expectativas e requisitos;
  • Contribuir para a Inovação Tecnológica: Esta pesquisa tem como objetivo contribuir para o avanço da inovação tecnológica no campo da gestão de compromissos, oferecendo uma solução mais eficaz e atualizada;
  • Promover a Adoção do ConnectyPrime: Desenvolver estratégias de promoção e adoção do ConnectyPrime entre as organizações e setores-alvo, garantindo que as melhorias beneficiam um amplo espectro de usuários.

4. Materiais e métodos

O desenvolvimento do sistema foi conduzido em ambiente tecnológico avançado, aproveitando diversas ferramentas e frameworks. Como Pohjola (2000) afirmou, o retorno social do investimento em Tecnologia da Informação é o maior, comparado ao investimento em outras áreas. É essa a ideia que norteia o desenvolvimento da tecnologia ConnectyPrime. 

Nesse contexto, exploraremos as tecnologias utilizadas, o desenvolvimento do front-end em React, o back-end implementado com .NET Web API, o desenvolvimento do banco de dados no Draw.io, o gerenciamento dos dados em MySQL, as estratégias de migração, o controle de versão via Git e a qualidade assegurada por meio de testes automatizados.

4.1. Planejamento

O uso desses softwares permitiu que o planejamento do projeto fosse realizado de forma eficiente e eficaz. O Draw.io permitiu que a equipe de desenvolvimento tivesse uma visão clara da estrutura do banco de dados, por meio de diagramas ERD (Diagramas de Entidade Relacional) enquanto o Figma permitiu que o design do sistema fosse avaliado com usuários reais, garantindo que atendesse às suas necessidades.

O Draw.io é um software de diagramação gratuito e online que permite a criação de diagramas de banco de dados, fluxogramas, organogramas, entre outros. Foi utilizado para a modelagem do banco de dados do sistema, definindo as tabelas, relacionamentos, atributos e restrições.

O Figma é um software de design gráfico colaborativo que permite a criação de protótipos, wireframes e interfaces gráficas. Foi utilizado para o desenvolvimento da interface do usuário e da experiência do usuário do sistema, levando em consideração as necessidades e expectativas dos usuários.

4.2. Desenvolvimento do Front-end (React)

Explorar o front-end de uma aplicação requer uma escolha estratégica, e o React assume um papel fundamental nesse contexto, como destacado por Mark Zuckerberg: “React não é apenas uma ferramenta, é uma abordagem para pensar em como construir interfaces de usuário” (Zuckerberg, 2015, p. 12). O React, uma biblioteca JavaScript de código aberto mantida pelo Facebook, revolucionou o desenvolvimento de interfaces de usuário reativas e eficientes.

Definido como “uma biblioteca JavaScript que usa componentes para construir interfaces de usuário reativas e eficientes”, o React adota uma abordagem modular por meio de componentes autônomos que encapsulam lógica e apresentação, facilitando a manutenção e reutilização de código. A virtualização do DOM pelo React otimiza a renderização, proporcionando uma experiência de usuário fluida (React, 2023).

O desenvolvimento de interfaces de usuário (UI) é uma etapa complexa e crucial para a concepção de aplicativos web eficientes e atraentes. Este trabalho enfatiza a importância da seleção cuidadosa de bibliotecas e frameworks durante o processo de desenvolvimento da UI, visando simplificar a implementação, aprimorar a experiência do usuário e garantir a segurança do aplicativo.

No decorrer do processo de desenvolvimento do front-end, diversas bibliotecas desempenharam um papel crucial, contribuindo significativamente para a construção de uma interface de usuário robusta e eficiente. A escolha criteriosa dessas ferramentas não apenas simplificou a implementação, mas também enriqueceu a experiência do usuário. Algumas das bibliotecas fundamentais utilizadas neste contexto foram:

  • Axios: Para a comunicação eficiente entre o front-end e o back-end, integramos a biblioteca Axios. Essa ferramenta simplifica a realização de requisições HTTP, garantindo uma interação suave com APIs e a obtenção de dados de forma eficaz.
  • React Bootstrap: A implementação de componentes visuais consistentes e responsivos foi facilitada pela inclusão do React Bootstrap. Essa biblioteca, baseada no Bootstrap, oferece um conjunto robusto de elementos de interface, promovendo a coesão visual e a usabilidade.
  • Tailwind CSS: A estilização da aplicação foi aprimorada com a utilização do Tailwind CSS. Sua abordagem baseada em classes proporciona uma personalização flexível do estilo, garantindo uma estética moderna e alinhada com as tendências de design.
  • React Router DOM: A gestão de rotas e a navegação eficiente entre as diferentes seções da aplicação foram possíveis graças ao React Router DOM. Essa biblioteca simplifica o controle de rotas, oferecendo uma experiência de navegação intuitiva para os usuários.
  • i18n (Internacionalização): Para atender a uma audiência global, incorporamos a biblioteca i18n para a internacionalização da aplicação. Essa ferramenta permite a tradução dinâmica do conteúdo, adaptando a experiência do usuário para diferentes idiomas e regiões.
  • JSON Web Tokens (JWT): Em termos de segurança, a biblioteca JWT foi integrada para a autenticação de forma eficiente. Inspirado pela ideia de “autenticação sem estado,” o JWT oferece uma maneira segura de transmitir informações de autenticação entre o cliente e o servidor, fortalecendo a integridade do sistema.

A escolha do React e a integração eficaz das bibliotecas Axios, React Bootstrap, Tailwind CSS, React Router DOM, i18n e JWT refletem uma abordagem abrangente no desenvolvimento de interfaces de usuário. Essas ferramentas não apenas simplificaram o processo de desenvolvimento, mas também contribuíram significativamente para uma experiência do usuário envolvente e moderna.

4.3. Desenvolvimento do Back-end (.NET Web API)

Explorando o âmbito do back-end, a escolha do framework .NET é respaldada pela validação de sua utilização para a construção de APIs Web, conforme explicado por Lock (2023), que afirma que o .NET representa uma abordagem alternativa à construção de APIs HTTP, o que, além de permitir maior solidez na estrutura da interface, também permite a modificação mais simples de componentes. Logo, observa-se a escalabilidade que o .NET proporciona, estabelecendo-o como uma base sólida para o desenvolvimento de aplicativos de diversos tipos que visem, sobretudo, eficiência e qualidade.

No que diz respeito à segurança, foi adotada uma abordagem avançada para proteger as informações sensíveis dos usuários. A implementação de práticas robustas de encriptação de senhas, em conjunto com a biblioteca JSON Web Tokens (JWT), oferece uma camada adicional de proteção. O JWT, inspirado pela ideia de “autenticação sem estado”, proporciona uma maneira eficiente e segura de transmitir informações de autenticação entre cliente e servidor, fortalecendo a integridade do sistema.

Portanto, a estruturação cuidadosa do back-end, aliada às estratégias de migração, práticas de segurança com bibliotecas como JWT, e à atenção dedicada ao desempenho e escalabilidade, solidificam a fundação do sistema. Constata-se que essa abordagem não apenas atende aos padrões atuais de desenvolvimento, mas também posiciona a aplicação para prosperar diante dos desafios em constante evolução do mundo digital.

4.4. Banco de Dados

A escolha do MySQL para o gerenciamento de dados foi fundamentada na confiabilidade e desempenho amplamente reconhecidos no cenário tecnológico. Um banco de dados é como a base de uma casa – se for mal construída, tudo pode desabar. Essa analogia ressalta a importância da escolha de uma base sólida para garantir a estabilidade e integridade das informações.

É nesse contexto que as migrações desempenham um papel crucial, assegurando que as alterações no esquema do banco de dados ocorram de maneira controlada e rastreável. Como um artesão que entalha uma obra-prima, a aplicação de migrações se mostra uma prática delicada que permite a evolução constante do banco de dados, sem comprometer a estrutura fundamental.

A implementação de migrações proporciona, sobretudo, um processo estruturado para modificar a estrutura do banco de dados, segundo Swiderski e Brown (2018). Esse método controlado evita rupturas inesperadas e garante que cada alteração seja aplicada de maneira ordenada. Além da estabilidade proporcionada pelo MySQL, a atenção cuidadosa é dedicada ao desempenho e à escalabilidade do banco de dados. Assim como um motor bem ajustado impulsiona um veículo, otimizações contínuas são implementadas para garantir que o MySQL atenda eficazmente às demandas crescentes de dados e usuários.

4.5. Controle de Versão

Segundo Linus Torvalds (2018), o controle de versão é apenas uma maneira muito elegante de dizer log de mudanças. No sistema ConnectyPrime, esse controle foi meticulosamente conduzido através da poderosa ferramenta Git, que se tornou essencial para a gestão eficiente do código-fonte.

Ainda em linha com o que foi apontado por Torvalds (2018), o controle de versão deve ser enxergado não só como uma simples ferramenta; mas sim como uma narrativa eloquente que documenta a evolução do código-fonte ao longo do tempo. Assim como um diário que capta a história de uma jornada, o controle de versão narra a jornada do código, permitindo que desenvolvedores compreendam, colaborem e evoluam com eficácia.

Dessa forma, o repositório Git emerge como uma espécie de biblioteca, onde cada commit é um capítulo na saga do desenvolvimento. Esse repositório não é apenas uma janela para o passado, mas sim um guia confiável para o presente e o futuro do projeto, já que, ao proporcionar um ambiente centralizado para colaboração, elimina barreiras na comunicação entre os membros da equipe.

O Git (Global Information Tracker) não apenas registra as mudanças, mas oferece uma visão granular do que foi modificado, quando e por quem. Essa precisão também é crucial para a resolução eficiente de conflitos e o rastreamento de bugs no projeto.

Neste ecossistema de desenvolvimento dinâmico, o controle de versão via Git se mostra não apenas como uma formalidade, mas sim como uma arte refinada. Em última análise, o controle de versão é a sinfonia que harmoniza a colaboração, a transparência e a evolução constante no desenvolvimento de software.

5. Desenvolvimento

O sistema foi concebido com o propósito de simplificar o agendamento de uma variedade de serviços. Para alcançar esse objetivo, foi implementado um modelo que divide o sistema em três modos: Modo A, direcionado aos clientes; Modo B, destinado aos administradores da empresa; e Modo C, o módulo mestre.

No Modo A, o acesso inicial é limitado, permitindo apenas cadastro, login, agendamento de horários, alterações nos agendamentos dentro de um limite predefinido, visualização dos horários agendados e modificações no perfil do cliente. Para o Modo B, são concedidas funcionalidades adicionais, incluindo cadastro, login, visualização dos agendamentos dos clientes, alteração de informações da empresa, criação e alteração de serviços oferecidos, além da modificação do perfil do administrador.

Finalmente, o Modo C, representando o nível mestre do sistema, oferece aos responsáveis a capacidade de lidar com bugs, implementar melhorias e ter acesso irrestrito ao sistema.

Em versões futuras, o Modo B terá a capacidade de criar usuários, permitindo a inclusão de funcionários. Esses funcionários utilizarão perfis semelhantes aos dos clientes (Modo A), e o Modo B será aprimorado para “D”, destinado especificamente aos funcionários.

Essas melhorias visam aprimorar a funcionalidade do sistema, proporcionando uma experiência mais abrangente e eficiente para os usuários em diferentes níveis de acesso.

5.1. Tela Inicial

A tela inicial do ConnectyPrime começa com um layout projetado para atrair a atenção do cliente, semelhante a sistemas atualmente em uso (Figura 2).

Figura 2 – Tela inicial do ConnectyPrime

Nesta tela, é possível clicar no logotipo para retornar à tela inicial, acessar os botões “Conecte-se” e “Começar” para ser redirecionado à tela de registro, pressionar o botão “Entrar” para acessar a tela de login e utilizar a opção de “Bandeira” para alternar entre os idiomas inglês, português e espanhol.

5.2. Tela de Cadastro

A tela de cadastro é o ponto onde o usuário (cliente do sistema) realiza seu registro. Nela, encontram-se a opção de escolha do idioma através de uma bandeira, três campos de entrada para dados (nome, e-mail e senha), um botão “Criar” e um hiperlink “Já tenho uma conta” para o usuário ser redirecionado para a tela de Login (Figura 3).

Figura 3 – Tela Cadastro

Ao clicar no botão, a interface aciona a API responsável por armazenar esses dados no banco. Contudo, antes de realizar a inserção, são efetuadas algumas modificações. A senha é criptografada para reforçar a segurança e um UUID é gerado para ser de key de segurança daquele usuário.

Quando o backend inserir os dados no banco de dados, o cliente receberá um e-mail via SMTP para ativar sua conta. No e-mail (Figura 4), haverá um botão. Ao clicar neste botão, o cliente será redirecionado para uma URL que modificará o campo no banco de 0 para 1, indicando que a conta foi confirmada. Após a confirmação pelo sistema, será gerado um HTML simples que exibirá a mensagem “Seu cadastro foi liberado”. A partir deste momento, o cliente poderá efetuar login normalmente.

Figura 4 – Email de confirmação

5.3. Tela de Login

A tela de login possui a opção de escolha do idioma através de uma bandeira, dois campos de entrada para dados (e-mail e senha), um botão “Entrar”, “não tenho uma conta” e “esqueci minha senha?” (Figura 5).

Figura 5 – tela de login

Quando o botão “Entrar” é acionado, o Backend realiza uma pesquisa no banco de dados utilizando o e-mail e a senha inseridos no login. Ele verifica a existência do e-mail no sistema; caso não seja encontrado, exibe um aviso na tela informando que o e-mail não está registrado. Se o e-mail estiver presente, o sistema desfaz a criptografia do usuário correspondente e compara as senhas. Se forem iguais, o processo continua.

Após essa confirmação, o Backend coleta os dados relevantes do banco de dados, como nome, função e chave, que serão enviados para o frontend. Em seguida, gera um JWT e o envia para o frontend. Depois de concluído esse processo, a tela inicial do sistema é aberta (Figura 6).

Figura 6 – Tela inicial

5.4. Sistema

O sistema, até o momento inicial do desenvolvimento, está estruturado em três funções, conforme mencionado no início. A seguir, apresentam-se os modelos para cada uma dessas funções.

5.4.1. Visão Cliente

As telas do Cliente, conforme endereçado na seção “Desenvolvimento” ainda é limitada, sendo permitidos apenas o agendamento de horários, alterações nos agendamentos dentro de um limite predefinido, visualização dos horários agendados e modificações no perfil do cliente.

5.4.1.1. Tela inicial

Na tela inicial (Figura 7), observamos o logotipo e a opção “Início”, que, ao ser clicada, redireciona para a página inicial do sistema. A seção “Meus Agendamentos” encaminha o usuário para visualizar seus agendamentos pessoais.

Figura 7 – Tela inicial 

Já a opção “Perfil” (Figura 8) revela funcionalidades adicionais. “Exibir Perfil” direciona para a visualização do perfil cadastrado, “Meus Agendamentos” redireciona para a página de agendamentos pessoais, e “Sair” encerra a sessão, permitindo ao usuário sair do sistema.

Figura 8 – Tela popUp perfil

Na tela inicial ao clicar em “Agende seu horário”, ele é redirecionado para a tela de agendar horário (Figura 10).

5.4.1.2 Tela Exibir Perfil

Na tela de “Exibir o Perfil” (Figura 9), o cliente terá acesso às informações de seu próprio perfil e terá a capacidade de editar o nome e o e-mail. Adicionalmente, o cliente poderá modificar a imagem do perfil. Após realizar essas edições, um pop-up confirmará as alterações realizadas, proporcionando uma confirmação visual imediata ao usuário. Esse processo oferece ao cliente a autonomia para manter suas informações de perfil atualizadas de maneira rápida e fácil.

Figura 9 – Tela exibir perfil

.

5.4.1.3 Tela de Agendar

Na interface da tela de agendamento (Figura 10, é mantido o mesmo cabeçalho presente na tela inicial, exibindo o logotipo e as opções de navegação. Essa tela oferece uma funcionalidade robusta com seis filtros distintos, possibilitando uma personalização eficiente da busca.

O primeiro filtro, intitulado “Categoria”, proporciona ao usuário a escolha da categoria do estabelecimento desejado, como saúde, beleza, entre outras opções disponíveis. O filtro seguinte, “Estabelecimento”, ajusta dinamicamente suas opções com base na categoria selecionada, exibindo estabelecimentos relacionados.

O terceiro filtro, denominado “Serviço”, compila todos os serviços cadastrados pelo estabelecimento, enquanto o filtro “Profissional” (planejado para a versão 2 do sistema) está projetado para listar todos os profissionais cadastrados pelo estabelecimento, proporcionando uma funcionalidade aprimorada futuramente.

Os filtros “Data” e “Hora” complementam a experiência de busca, apresentando respectivamente as datas disponíveis para agendamento e as horas ainda disponíveis no estabelecimento. Essa abordagem modular dos filtros oferece ao usuário a capacidade de refinar suas escolhas, garantindo uma experiência de agendamento personalizada e eficaz.

Uma vez selecionados os filtros desejados, basta clicar no botão correspondente para ser redirecionado para a tela de confirmação dos dados escolhidos. Nessa etapa, o usuário poderá revisar e confirmar as informações antes de finalizar o processo de agendamento.

Figura 10 – Tela de agendar horário

5.4.1.4. Tela de Confirmação do agendamento

Nesta tela (Figura 11), o usuário terá a oportunidade de visualizar de maneira mais clara todos os dados escolhidos por meio dos filtros. Se as informações apresentadas corresponderem às suas expectativas, ele pode prosseguir e confirmar o agendamento pressionando o botão “Agendar”. Por outro lado, se decidir reconsiderar ou fazer ajustes, a opção de voltar estará disponível com o botão correspondente. Essa abordagem visa proporcionar ao usuário uma experiência intuitiva e flexível, permitindo que ele tome decisões informadas antes de finalizar o processo de agendamento.

Figura 11 – Tela de confirmação de agendamentos

Após a confirmação ao pressionar o botão “Agendar”, será exibido um modal (PopUP) na tela (Figura 12), comunicando ao usuário que o agendamento foi confirmado com sucesso. 

Figura 12 – Tela de confirmação

5.4.1.5. Tela de Agendamentos

Na tela de agendamentos (Figura 13), o cabeçalho padrão será exibido, contendo as opções usuais de navegação. Nesta seção, serão apresentados todos os agendamentos realizados pelo usuário. Além disso, um filtro de data estará disponível, permitindo ao usuário visualizar agendamentos em diferentes datas. Essa funcionalidade oferece flexibilidade ao usuário, possibilitando a visualização e a gestão eficiente de seus compromissos agendados ao longo do tempo.

Na tela de agendamentos (Figura 13), os usuários terão a capacidade de editar ou excluir agendamentos já realizados. No entanto, a exclusão estará disponível apenas para agendamentos com pelo menos 3 dias de antecedência. Passado esse prazo, a opção de exclusão não estará mais disponível.]

Figura 13 – Tela de agendamentos

Ao selecionar a opção de editar, um ícone correspondente permitirá ao usuário visualizar um modal (PopUP) contendo as informações do agendamento atual (Figura 14). Nesse modal, será possível realizar alterações, com foco na troca da data e hora do serviço. Essa abordagem oferece uma maneira conveniente e intuitiva para os clientes ajustarem seus agendamentos conforme necessário, mantendo a funcionalidade de edição restrita à data e hora do serviço para garantir a consistência das operações.

Figura 14 – Tela edição de agendamentos

Após a confirmação ao pressionar o botão “Salvar”, será exibido um modal (PopUP) na tela (Figura 12), comunicando ao usuário que o agendamento foi confirmado com sucesso. 

5.4.2. Visão Administrador da empresa

As telas do administrador da empresa, conforme discutido no desenvolvimento, terão um nível de acesso superior ao do cliente, equivalente ao da conta master. No entanto, o administrador terá permissões restritas para visualizar e editar apenas informações relacionadas à sua empresa específica. Essa abordagem concede ao administrador um controle mais abrangente sobre as operações internas da organização, permitindo uma gestão eficiente e personalizada das informações pertinentes ao contexto empresarial.

É importante observar que, conforme mencionado no início do desenvolvimento, a função de usuário será implementada na versão 2 do sistema. Isso permitirá que o administrador da empresa cadastre seus funcionários, caso necessário, proporcionando uma maior flexibilidade na administração dos recursos humanos da organização.

5.4.2.1. Tela início

Na tela inicial (Figura 6), são apresentados o logotipo e várias opções de navegação. Ao clicar em “Início”, o usuário é redirecionado para a página principal do sistema. A seção “Meus Agendamentos” permite visualizar os agendamentos pessoais do usuário. A opção “Empresa” direciona para a visualização da empresa, enquanto a seção “Usuários” leva à visualização dos funcionários cadastrados. A opção “Serviços” permite visualizar os serviços criados. Adicionalmente, há a opção “Agendar Horário”, permitindo que a empresa agende horários para clientes. A funcionalidade “Cadastrar Usuários” possibilita o cadastro de funcionários, enquanto a opção “Serviços” permite cadastrar novos serviços. A opção “Empresa” possibilita editar as informações da empresa. Essas opções proporcionam uma ampla gama de funcionalidades, tornando a tela inicial uma central completa para as operações da empresa no sistema.

Já a opção “Perfil” (Figura 7) revela funcionalidades adicionais. “Exibir Perfil” direciona para a visualização do perfil cadastrado, “Meus Agendamentos” redireciona para a página de agendamentos pessoais, e “Sair” encerra a sessão, permitindo ao usuário sair do sistema.

5.4.2.2. Tela Exibir Perfil

Na tela de “Exibir o Perfil” (Figura 15), o cliente terá acesso às informações do seu perfil e terá a capacidade de editar o nome e o e-mail. Adicionalmente, também poderá modificar a imagem do perfil. Após realizar essas edições, um pop-up confirmará as alterações realizadas, proporcionando uma confirmação visual imediata ao usuário. Esse processo oferece ao Adm da empresa autonomia para manter suas informações de perfil atualizadas de maneira rápida e fácil.

Figura 15 – Tela exibir perfil

5.4.2.3. Tela de Agendar

Na interface da tela de agendar (Figura 16), é mantido o mesmo cabeçalho presente na tela inicial, exibindo o logotipo e as opções de navegação. Essa tela oferece uma funcionalidade robusta com seis filtros distintos, possibilitando uma personalização eficiente da busca.

O primeiro filtro, intitulado “Categoria”, proporciona ao usuário a escolha da categoria do estabelecimento desejado, como saúde, beleza, entre outras opções disponíveis. O filtro seguinte, “Estabelecimento”, ajusta dinamicamente suas opções com base na categoria selecionada, exibindo estabelecimentos relacionados.

O terceiro filtro, denominado “Serviço”, compila todos os serviços cadastrados pelo estabelecimento, enquanto o filtro “Profissional” (planejado para a versão 2 do sistema) está projetado para listar todos os profissionais cadastrados pelo estabelecimento, proporcionando uma funcionalidade aprimorada futuramente.

Os filtros “Data” e “Hora” complementam a experiência de busca, apresentando respectivamente as datas disponíveis para agendamento e as horas ainda disponíveis no estabelecimento. Essa abordagem modular dos filtros oferece ao usuário a capacidade de refinar suas escolhas, garantindo uma experiência de agendamento personalizada e eficaz.

Uma vez selecionados os filtros desejados, basta clicar no botão correspondente para ser redirecionado para a tela de confirmação dos dados escolhidos. Nessa etapa, o usuário poderá revisar e confirmar as informações antes de finalizar o processo de agendamento.

Figura 16 – Tela agendar horário

5.4.2.4. Tela de Confirmação do agendamento

Nesta tela (Figura 17), o usuário terá a oportunidade de visualizar de maneira mais clara todos os dados escolhidos por meio dos filtros. Se as informações apresentadas corresponderem às suas expectativas, ele pode prosseguir e confirmar o agendamento pressionando o botão “Agendar”. Por outro lado, se decidir reconsiderar ou fazer ajustes, a opção de voltar está disponível com o botão correspondente. Essa abordagem visa proporcionar ao usuário uma experiência intuitiva e flexível, permitindo que ele tome decisões informadas antes de finalizar o processo de agendamento.

Figura 17 – Tela confirmação agendamentos

Após a confirmação ao pressionar o botão “Agendar”, será exibido um modal (PopUP) na tela (Figura 12), comunicando ao usuário que o agendamento foi confirmado com sucesso. ]

5.4.2.5. Tela de Agendamentos

Na tela de agendamentos (Figura 18), o cabeçalho padrão será exibido, contendo as opções usuais de navegação. Nesta seção, serão apresentados todos os agendamentos realizados pelo usuário. Além disso, um filtro de data estará disponível, permitindo ao usuário visualizar agendamentos em diferentes datas. Essa funcionalidade oferece flexibilidade ao usuário, possibilitando a visualização e a gestão eficiente de seus compromissos agendados ao longo do tempo e os adms terão a capacidade de editar ou excluir agendamentos já realizados. No entanto, a exclusão estará disponível apenas para agendamentos com pelo menos 3 dias de antecedência. Passado esse prazo, a opção de exclusão não estará mais disponível.

Figura 18 – Tela de agendamentos

Ao selecionar a opção de editar, um ícone correspondente permitirá ao usuário visualizar um modal (PopUP) contendo as informações do agendamento atual (Figura 19). Nesse modal, será possível realizar alterações, com foco na troca da data e hora do serviço. Essa abordagem oferece uma maneira conveniente e intuitiva para os clientes ajustarem seus agendamentos conforme necessário, mantendo a funcionalidade de edição restrita à data e hora do serviço para garantir a consistência das operações.

Figura 19 – Tela edição agendamentos

Após a confirmação ao pressionar o botão “Salvar”, será exibido um modal (PopUP) na tela (Figura 12), comunicando ao usuário que o agendamento foi confirmado com sucesso. 

5.4.2.6. Tela de Edição/Visualização de Serviços

Na tela de Edição/Visualização de serviço (Figura 20), o cabeçalho padrão será exibido, contendo as opções usuais de navegação e os adms terão a capacidade de editar ou excluir serviços. 

Figura 20 – Tela serviços

Ao selecionar a opção de editar, um ícone correspondente permitirá ao usuário visualizar um modal (PopUP) contendo as informações do serviço atual ( Figura 21). Nesse modal, será possível realizar alterações, com foco na troca do nome, valor, descrição e imagem do serviço. Essa abordagem oferece uma maneira conveniente e intuitiva para os Adms ajustarem seus serviços conforme necessário.

Figura 21 – Tela edição de serviço

Após a confirmação ao pressionar o botão “Salvar”, será exibido um modal (PopUP) na tela (Figura 12), comunicando ao usuário que o serviço foi confirmado com sucesso. 

5.4.2.7. Tela de Edição/Visualização  de Empresa

Na tela de Edição/Visualização de Empresa (Figura 22), o cabeçalho padrão será exibido, contendo as opções usuais de navegação e os adms terão a capacidade de editar a empresa. 

Figura 22- Tela empresas

Ao selecionar a opção de editar, um ícone correspondente permitirá ao administrador visualizar um modal (PopUP) contendo as informações da empresa (Figura 23). Nesse modal, será possível realizar alterações, com foco na troca do nome, valor, e-mail, telefone, dias da semana de funcionamento, se a empresa abre em feriados, a imagem do local, a hora de abertura, a hora do intervalo para o almoço e a hora de fechamento. Essa abordagem oferece uma maneira conveniente e intuitiva para os administradores ajustarem as informações da empresa conforme necessário.

Figura 23 – Tela edição empresa

Após a confirmação ao pressionar o botão “Salvar”, será exibido um modal (PopUP) na tela (Figura 12), comunicando ao usuário que o serviço foi confirmado com sucesso. 

5.4.2.8. Tela de Edição/Visualização de Usuários/Funcionários

A tela de Edição/Visualização de Usuários/Funcionários está atualmente em fase de aprovação para ser desenvolvida na nova versão do sistema. Ela contará com a funcionalidade de criar e editar informações dos funcionários. Essa abordagem destaca o compromisso contínuo com o aprimoramento do sistema, proporcionando aos usuários a capacidade de gerenciar e manter eficientemente os perfis de funcionários.

5.4.2.9. Tela de cadastro Serviço

Na tela de cadastro de serviço (Figura 24), o cabeçalho padrão será exibido, contendo as opções usuais de navegação e os adms terão a capacidade de criar o serviços. 

Figura 24 – Tela cadastro de serviço

Após a confirmação ao pressionar o botão “Salvar”, será exibido um modal (PopUP) na tela (Figura 12), comunicando ao usuário que o serviço foi confirmado com sucesso. 

5.4.2.10. Tela de cadastro Usuário

A tela de criação de Usuários/Funcionários está atualmente em fase de aprovação para ser desenvolvida na nova versão do sistema. Ela contará com a funcionalidade de criar e editar informações dos funcionários. Essa abordagem destaca o compromisso contínuo com o aprimoramento do sistema, proporcionando aos usuários a capacidade de gerenciar e manter eficientemente os perfis de funcionários. 

5.4.3. Visão Master do Sistema

As telas destinadas ao “Master do Sistema”, conforme delineado no desenvolvimento, apresentaram um nível de acesso superior ao do cliente, equiparado à conta master. O “Master do Sistema” tem permissões amplas e abrangentes, permitindo realizar todas as criações e edições no sistema. Ele detém uma visão geral, possibilitando uma administração completa e flexível de todas as funcionalidades do sistema. Essa abordagem confere ao “Master do Sistema” um controle abrangente sobre as operações internas da organização, viabilizando uma gestão eficiente e personalizada das informações relevantes ao contexto empresarial.

5.4.3.1. Tela início

Na tela inicial (Figura 25), são apresentados o logotipo e várias opções de navegação. Ao clicar em “Início”, o usuário é redirecionado para a página principal do sistema. A seção “Meus Agendamentos” permite visualizar os agendamentos pessoais do usuário. A opção “Empresa” direciona para a visualização da empresa, enquanto a seção “Usuários” leva à visualização dos funcionários cadastrados. A opção “Serviços” permite visualizar os serviços criados. Adicionalmente, há a opção “Agendar Horário”, permitindo que a empresa agende horários para clientes. A funcionalidade “Cadastrar Usuários” possibilita o cadastro de funcionários, enquanto a opção “Serviços” permite cadastrar novos serviços. A opção “Empresa” possibilita editar as informações da empresa. Essas opções proporcionam uma ampla gama de funcionalidades, tornando a tela inicial uma central completa para as operações da empresa no sistema.

Figura 25 – Tela inicial sistema

Já a opção “Perfil” (Figura 8) revela funcionalidades adicionais. “Exibir Perfil” direciona para a visualização do perfil cadastrado, “Meus Agendamentos” redireciona para a página de agendamentos pessoais, e “Sair” encerra a sessão, permitindo ao usuário sair do sistema.

5.4.3.2. Tela Exibir Perfil

Na tela de “Exibir o Perfil” (Figura 26), o Master terá acesso às informações do seu perfil e terá a capacidade de editar o nome, o e-mail. Adicionalmente, o Master poderá também modificar a imagem do perfil. Após realizar essas edições, um pop-up confirmará as alterações realizadas, proporcionando uma confirmação visual imediata ao usuário. Esse processo oferece ao Master autonomia para manter suas informações de perfil atualizadas de maneira rápida e fácil.

Figura 26 – Tela exibir perfil

5.4.3.3. Tela de Agendar

Na interface da tela de Agendar (Figura 27), é mantido o mesmo cabeçalho presente na tela inicial, exibindo o logotipo e as opções de navegação. Essa tela oferece uma funcionalidade robusta com seis filtros distintos, possibilitando uma personalização eficiente da busca.

O primeiro filtro, intitulado “Categoria”, proporciona ao usuário a escolha da categoria do estabelecimento desejado, como saúde, beleza, entre outras opções disponíveis. O filtro seguinte, “Estabelecimento”, ajusta dinamicamente suas opções com base na categoria selecionada, exibindo estabelecimentos relacionados.

O terceiro filtro, denominado “Serviço”, compila todos os serviços cadastrados pelo estabelecimento, enquanto o filtro “Profissional” (planejado para a versão 2 do sistema) está projetado para listar todos os profissionais cadastrados pelo estabelecimento, proporcionando uma funcionalidade aprimorada futuramente.

Os filtros “Data” e “Hora” complementam a experiência de busca, apresentando respectivamente as datas disponíveis para agendamento e as horas ainda disponíveis no estabelecimento. Essa abordagem modular dos filtros oferece ao usuário a capacidade de refinar suas escolhas, garantindo uma experiência de agendamento personalizada e eficaz.

Uma vez selecionados os filtros desejados, basta clicar no botão correspondente para ser redirecionado para a tela de confirmação dos dados escolhidos. Nessa etapa, o usuário poderá revisar e confirmar as informações antes de finalizar o processo de agendamento.

Figura 27 – Tela inicial para agendar horário

5.4.3.4. Tela de Confirmação do agendamento

Nesta tela (Figura 28), o usuário terá a oportunidade de visualizar de maneira mais clara todos os dados escolhidos por meio dos filtros. Se as informações apresentadas corresponderem às suas expectativas, ele pode prosseguir e confirmar o agendamento pressionando o botão “Agendar”. Por outro lado, se decidir reconsiderar ou fazer ajustes, a opção de voltar está disponível com o botão correspondente. Essa abordagem visa proporcionar ao usuário uma experiência intuitiva e flexível, permitindo que ele tome decisões informadas antes de finalizar o processo de agendamento.

Figura 28 – Tela confirmação do agendamento

Após a confirmação ao pressionar o botão “Agendar”, será exibido um modal (PopUP) na tela (Figura 13), comunicando ao usuário que o agendamento foi confirmado com sucesso. 

5.4.3.5. Tela de Agendamentos

Na tela de agendamentos (Figura 29), o cabeçalho padrão será exibido, contendo as opções usuais de navegação. Nesta seção, serão apresentados todos os agendamentos realizados pelo usuário. Além disso, um filtro de data estará disponível, permitindo ao usuário visualizar agendamentos em diferentes datas, assim como um filtro de empresas para poder visualizar os agendamentos de todas as empresas. Essa funcionalidade oferece flexibilidade ao usuário, possibilitando a visualização e a gestão eficiente de seus compromissos agendados ao longo do tempo e os “Masters” terão a capacidade de editar ou excluir agendamentos já realizados. Importante destacar que a exclusão realizada pelo “Master” não possui restrições, proporcionando uma liberdade completa na gestão desses agendamentos. Essa funcionalidade dá ao “Master” controle total sobre os registros de agendamento, facilitando a administração eficaz das operações do sistema.

Figura 29 – Tela agendamentos

Ao selecionar a opção de editar, um ícone correspondente permitirá ao usuário visualizar um modal (PopUP) contendo as informações do agendamento atual ( Figura 31). Nesse modal, será possível realizar alterações, com foco na troca da data e hora do serviço. Essa abordagem oferece uma maneira conveniente e intuitiva para os clientes ajustarem seus agendamentos conforme necessário, mantendo a funcionalidade de edição restrita à data e hora do serviço para garantir a consistência das operações.

Figura 30 – Tela edição de agendamentos

Após a confirmação ao pressionar o botão “Salvar”, será exibido um modal (PopUP) na tela (Figura 12), comunicando ao usuário que o agendamento foi confirmado com sucesso. 

5.4.3.6. Tela de Edição/Visualização de Serviços

Na tela de Edição/Visualização de Serviço (Figura 31), o cabeçalho padrão será exibido, contendo as opções usuais de navegação. Os “Masters” terão a capacidade de editar ou excluir serviços. É importante ressaltar que nesta tela, os “Masters” contarão com um filtro de empresas, permitindo uma visualização mais específica e direcionada dos serviços relacionados a diferentes empresas. Essa funcionalidade proporciona aos “Masters” um controle refinado sobre a gestão de serviços, adaptado às necessidades específicas de cada empresa vinculada ao sistema.

Figura 31 – Tela de serviços

.

Ao selecionar a opção de editar, um ícone correspondente permitirá ao usuário visualizar um modal (PopUP) contendo as informações do serviço atual ( Figura 32). Nesse modal, será possível realizar alterações, com foco na troca do nome, valor, descrição e imagem do serviço. Essa abordagem oferece uma maneira conveniente e intuitiva para os Masters ajustarem seus serviços conforme necessário.

Figura 32 – Tela de edição de serviços

Após a confirmação ao pressionar o botão “Salvar”, será exibido um modal (PopUP) na tela (Figura 12), comunicando ao usuário que o serviço foi confirmado com sucesso. 

5.4.3.7. Tela de Edição/Visualização  de Empresa

Na tela de Edição/Visualização de Empresa (Figura 33), o cabeçalho padrão será exibido, contendo as opções usuais de navegação. Nessa tela, os “Masters” terão a capacidade exclusiva de editar todas as empresas do sistema. Essa permissão ampla e abrangente concede aos “Masters” total controle sobre as informações e configurações de cada empresa vinculada ao sistema, assegurando uma administração eficiente e personalizada de acordo com as necessidades globais do sistema.

Figura 33 – Tela empresa

Ao selecionar a opção de editar, um ícone correspondente permitirá ao administrador visualizar um modal (PopUP) contendo as informações da empresa (Figura 35). Nesse modal, será possível realizar alterações, com foco na troca do nome, valor, e-mail, telefone, dias da semana de funcionamento, se a empresa abre em feriados, a imagem do local, a hora de abertura, a hora do intervalo para o almoço e a hora de fechamento. Essa abordagem oferece uma maneira conveniente e intuitiva para os administradores ajustarem as informações da empresa conforme necessário.

Figura 34 -Tela edição da empresa

Após a confirmação ao pressionar o botão “Salvar”, será exibido um modal (PopUP) na tela (Figura 12), comunicando ao usuário que o serviço foi confirmado com sucesso. Essa notificação visual oferece uma confirmação imediata e proporciona uma experiência transparente, assegurando ao usuário que sua ação foi concluída com êxito.

5.4.3.8. Tela de Edição/Visualização de Usuários/Funcionários

Na tela de Edição/Visualização de Empresa (Figura 35), o cabeçalho padrão será exibido, contendo as opções usuais de navegação. Nessa tela, os “Masters” terão a capacidade exclusiva de editar todos os usuários do sistema. Essa permissão ampla e abrangente concede aos “Masters” total controle sobre as informações e configurações de cada usuário vinculada ao sistema, assegurando uma administração eficiente e personalizada de acordo com as necessidades globais do sistema.

Figura 35 – Tela usuários

Ao selecionar a opção de editar, um ícone correspondente permitirá ao Master visualizar um modal (PopUP) contendo as informações da empresa (Figura 37). Nesse modal, será possível realizar alterações, com foco na troca de todas as informações. Essa abordagem oferece uma maneira conveniente e intuitiva para os Masters ajustarem as informações da empresa conforme necessário.

Figura 36 – Tela edição do usuários

Após a confirmação ao pressionar o botão “Salvar”, será exibido um modal (PopUP) na tela (Figura 12), comunicando ao usuário que o serviço foi confirmado com sucesso. Essa notificação visual oferece uma confirmação imediata e proporciona uma experiência transparente, assegurando ao usuário que sua ação foi concluída com êxito.

5.4.3.9. Tela de cadastro Serviço

Na tela de cadastro de serviço (Figura 37), o cabeçalho padrão será exibido, contendo as opções usuais de navegação e os masters terão a capacidade de criar o serviços. 

Figura 37 – Tela cadastro de serviços

Após a confirmação ao pressionar o botão “Salvar”, será exibido um modal (PopUP) na tela (Figura 12), comunicando ao usuário que o serviço foi confirmado com sucesso. Essa notificação visual oferece uma confirmação imediata e proporciona uma experiência transparente, assegurando ao usuário que sua ação foi concluída com êxito.

5.4.3.10. Tela de cadastro Usuário

Na tela de cadastro de usuário (Figura 38), o cabeçalho padrão será exibido, contendo as opções usuais de navegação e os Masters terão a capacidade de criar o serviços. 

Figura 38 – Tela cadastro de usuários

Após a confirmação ao pressionar o botão “Salvar”, será exibido um modal (PopUP) na tela (Figura 12), comunicando ao usuário que o serviço foi confirmado com sucesso. Essa notificação visual oferece uma confirmação imediata e proporciona uma experiência transparente, assegurando ao usuário que sua ação foi concluída com êxito.

5.4.3.11. Tela de cadastro Empresa

Na tela de Cadastro de Empresa (Figura 39), o cabeçalho padrão será exibido, contendo as opções usuais de navegação. Nessa tela, os “Masters” terão a capacidade exclusiva de criar uma nova empresa. No entanto, a responsabilidade pela edição ficará a cargo do administrador específico da empresa. Essa abordagem distribuída de permissões assegura uma estrutura hierárquica, onde os “Masters” têm o poder de criar novas entidades, enquanto os administradores individuais têm controle sobre a edição e personalização dos detalhes da empresa que lhes são designados. Isso promove uma gestão eficiente e direcionada de informações específicas de cada empresa no sistema.

Figura 39 – Tela cadastro de empresa

Após a confirmação ao pressionar o botão “Salvar”, será exibido um modal (PopUP) na tela (Figura 12), comunicando ao usuário que o serviço foi confirmado com sucesso. Essa notificação visual oferece uma confirmação imediata e proporciona uma experiência transparente, assegurando ao usuário que sua ação foi concluída com êxito.

6. Discussão

A implementação de um sistema de agendamento integrado para empresas representa uma etapa crucial nos cenários corporativo e pessoal atuais, marcados pela busca incessante por eficiência operacional e experiências personalizadas para usuários. O desenvolvimento desse sistema visa atender às necessidades específicas de empresas, proporcionando uma solução abrangente para a gestão de agendamentos, serviços e usuários.

Dessa forma, a hierarquia de permissões emergiu como um ponto crucial no design do sistema. Ao conceder diferentes níveis de acesso com base nos cargos dos usuários, foi possível personalizar a experiência de cada grupo. Os “Masters”, como detentores do mais alto nível de permissões, têm a capacidade de gerenciar globalmente o sistema, criando e editando empresas, serviços e usuários. Essa abordagem proporciona uma facilitação da visão geral do sistema, permitindo ajustes dinâmicos conforme as necessidades.

A tela de agendamentos, central para a proposta, oferece uma visão abrangente dos compromissos, permitindo aos usuários gerenciar eficientemente seus agendamentos. A inclusão de filtros por data e empresa amplia a flexibilidade, adaptando-se às preferências individuais e às necessidades específicas de cada empresa.

No entanto, é fundamental reconhecer que, embora tenha se alcançado uma fase funcional no desenvolvimento, algumas funcionalidades planejadas, como a função de usuário, ainda estão em fase de aprovação para a próxima versão do sistema.

7. Conclusão

A implementação do sistema de agendamento integrado para empresas, conforme já mencionado anteriormente, representa um passo significativo em direção à modernização e otimização das operações empresariais.

Observou-se que a hierarquia de permissões se tornou uma ferramenta indispensável na customização da experiência do usuário, destacando a capacidade dos “Masters” de gerenciar o sistema de forma abrangente. A tela de agendamentos, com seus filtros inteligentes, proporcionou flexibilidade e eficiência na gestão de compromissos, refletindo diretamente na satisfação do cliente.

A discussão em torno da fase de aprovação para a próxima versão do sistema ressalta a natureza iterativa do desenvolvimento de software. Novas perspectivas e melhorias contínuas são essenciais para garantir que o sistema evolua em resposta às demandas do ambiente empresarial em constante mudança.

À medida que consideramos o impacto do sistema de agendamento integrado, percebemos sua relevância para a eficiência operacional e a satisfação do cliente. No entanto, é crucial não apenas reconhecer o progresso alcançado, mas também abraçar a jornada contínua de desenvolvimento. Somente assim, com comprometimento contínuo, atualizações e adaptações, podemos garantir que o sistema não apenas atenda, mas supere as expectativas em constante evolução das empresas e de seus usuários.

As limitações encontradas durante o desenvolvimento, como a falta de tempo e conhecimento técnico, não apenas sublinham a importância da gestão de recursos, mas também indicam áreas específicas que podem ser aprimoradas. A não conclusão de todas as funcionalidades planejadas, embora represente um desafio, também abre portas para futuras iterações e melhorias.

Dessa forma, a próxima versão do sistema se apoiará na criação de uma camada adicional de personalização, permitindo que as empresas cadastrem e gerenciem funcionários de maneira eficiente.

Logo, é essencial reconhecer que, embora o sistema tenha alcançado marcos significativos, seu verdadeiro potencial será realizado por meio de compromissos contínuos com o desenvolvimento e atualizações. As soluções tecnológicas não são estáticas; elas devem evoluir para atender às demandas mutáveis do cenário empresarial.

Em última análise, o sistema de agendamento integrado é mais do que uma ferramenta; é uma resposta à busca incessante por eficiência, personalização e satisfação do cliente. Ao abraçar a jornada contínua de desenvolvimento, garantimos que o sistema permaneça relevante, eficaz e, acima de tudo, uma contribuição valiosa para a eficiência e inovação no contexto empresarial.

No âmago da implementação do sistema de agendamento integrado, emerge a compreensão de que a tecnologia, embora uma ferramenta poderosa, é inextricavelmente ligada à dinâmica humana. A hierarquia de permissões, ao oferecer uma estrutura adaptativa, não apenas reforça a segurança do sistema, mas também respeita a natureza diversificada das funções e responsabilidades dentro de uma organização.

A tela de agendamentos, concebida para proporcionar uma visão panorâmica dos compromissos, não é apenas um espaço funcional, mas uma interface que reflete a importância do design centrado no usuário. A inclusão de filtros específicos, como data e empresa, não é apenas uma medida de praticidade, mas um reconhecimento da variabilidade inerente às operações empresariais.

8. Referências bibliográficas

BUENO, G.; LUCENA, T. Geração cabeça-baixa: saúde e comportamento dos jovens no uso das tecnologias móveis. IX Simpósio Nacional ABCiber, São Paulo, 2016.

LUNARDI, G.; DOLCI, D.; WENDLAND, J.  Internet móvel nas organizações: fatores de adoção e impactos sobre o desempenho. Scielo, Rio Grande do Sul, 2013.

LIMA, J. R. A importância da gestão eficaz de compromissos e agendamentos. In: Educação para um mundo exponencial. São Paulo: Editora Novatec, 2023. p. 123-125.

Zuckerberg, M. (2015). Building a better future for the social web. New York: HarperCollins.

React. (2023). [Documentação oficial]. Recuperado de https://reactjs.org/

Gates, Bill. “Announcing .NET.” Microsoft.com. Microsoft, 2002. Web. 21 Nov. 2023.

Diagrams.net. (2023). Draw.io: A free online diagramming application. Retrieved from https://drawio.com/

Figma. (2023). Figma: The collaborative design platform. Retrieved from https://www.figma.com/Buffett, W. (2006). The Fortune Interview: Warren Buffett. Fortune, 154(10), 72-78.

Buffett, W. (2012). The Essays of Warren Buffett: Lessons for Corporate America. New York, NY: HarperCollins Publishers.

Buffett, W. (2019). The Intelligent Investor: The Definitive Book on Value Investing. New York, NY: HarperCollins Publishers.

Beck, K. (2012). Test-Driven Development: By Example. 3rd ed. Boston, MA: Addison-Wesley.

Selenium. (2023). Selenium documentation. Retrieved from https://www.selenium.dev/documentation/en/: https://www.selenium.dev/documentation/en/

Selenium WebDriver. (2023). Selenium WebDriver documentation. Retrieved from https://www.selenium.dev/documentation/en/webdriver/: 

Herrington, J. (2022). Selenium WebDriver in Action: Automating Web Applications with Java. 3rd ed. Manning Publications Co.

Linus Torvalds. TecnoBlog. (2018). https://tecnoblog.net/noticias/2018/01/08/linus-torvalds-meltdown-e-spectre/

Swiderski, K.; e Brown, J. (2018). Database Migrations: A Practical Guide to Managing Database Change

Jones, B. (2017). The Benefits of Database Migrations

Coyne, M. (2022). How to Implement Database Migrations

KLEMENT, C.; YU, A.. Inovação em Serviços: Importância da Tecnologia de Informação. SEGeT – Simpósio de Excelência em Gestão e Tecnologia, São Paulo, 2008.

SERVELIN, C.; ANSCHAU, C.; SCHNEIDER, A.; DE PAULA, R. BENEFÍCIOS DO INVESTIMENTO EM AUTOMAÇÃO NO PROCESSO DE EMPACOTAMENTO DE FARINHA DE TRIGO.  ANAIS – Engenharia de Produção, Chapecó, SC. V.2, N° 1, 2018.

A. C. M. MATTOS. Sistemas de Informação. 1° Edição. São Paulo: Editora Saraiva, 2005.

FINLEY M. “The Ancient Economy,” University of California Press, 1973.