# Desenvolvimento de Sites # Fluxo de desenvolvimento de site ### **ETAPA 01 - Coleta do briefing com o cliente** **1.1 Primeiro contato e alinhamento inicial** Nesse primeiro contato com o cliente, explico que darei início ao desenvolvimento do seu site e que precisarei coletar algumas informações para entender melhor o projeto e alinhar as expectativas. **1.2 Levantamento das informações principais e recebimento de materiais** Nessa etapa, compartilho o briefing com o cliente, total ou parcialmente, fazendo as perguntas necessárias para compreender seu negócio, seus objetivos e suas expectativas em relação ao site. Ao mesmo tempo, solicito os materiais essenciais para o projeto, como logotipo, imagens, fotos, textos institucionais, descrição de serviços e quaisquer outros conteúdos relevantes. Conforme o cliente responde e envia os materiais, registro tudo em um documento que servirá como base para o desenvolvimento do site. ### **ETAPA 02 - Desenvolvimento do site** **2.1 Planejamento da estrutura** Após analisar o briefing e os materiais enviados pelo cliente, defino as páginas principais do site, a estrutura do menu de navegação e a organização do conteúdo, sempre alinhado aos objetivos do projeto. **2.2 Desenvolvimento e criação do layout do site** Com o planejamento da estrutura definido, inicio o desenvolvimento do layout do site. Nessa etapa, o design visual é criado de forma alinhada à identidade da marca do cliente, utilizando o logotipo, cores, imagens e textos já coletados. O site é construído pensando não apenas na aparência, mas também na experiência do usuário, levando em conta uma navegação intuitiva, bom desempenho, boa organização das informações e aspectos básicos de SEO para facilitar que o site seja encontrado nos mecanismos de busca. Além disso, o layout é desenvolvido para funcionar corretamente tanto em computadores quanto em celulares. ### **ETAPA 03 - Revisão e aprovação** **3.1 Envio de link de demonstração** Após a conclusão do site, é disponibilizado ao cliente um link de acesso ao ambiente de testes. Por padrão, esse acesso fica armazenado dentro da pasta novosite, **por exemplo:** dominio.com.br/novosite O cliente pode navegar livremente, analisar o conteúdo e testar o layout sem que o site esteja aberto ao público. **3.2 Ajustes solicitados** Receber feedback do cliente e realizar correções até que o projeto esteja alinhado às expectativas. **Modelo de mensagem para enviar para o cliente:** > Olá **{{Cliente}}**, bom dia, tudo bem? > > Passando para avisar que seu site está pronto. > > Abaixo estou enviando os links de teste para que vocês possam visualizar e analisar o layout do site. Fique à vontade para olhar com calma e me dizer se deseja alguma alteração ou ajuste. > > **{{ dominiodosite.com.br/novosite }}** > > Assim que você revisar, me confirme se está aprovado para que possamos seguir com a publicação. > Vale lembrar que alguns conteúdos presentes no site são apenas conteúdos de teste, podendo ser ajustados e atualizados posteriormente diretamente pelo painel administrativo. > > A seguir, seguem os dados de acesso ao painel administrativo para que possam realizar a gestão do site. > > https://dominio.com.br/admin > E-mail: email@dominio.com.br > Senha: \*\*\*\*\* > > Esperamos que gostem do resultado final. > Qualquer ajuste que desejarem, estamos à disposição 😃 ### **ETAPA 04 - Publicação do site** **4.1 Lançamento oficial** Após a aprovação final do cliente, o site é publicado no domínio oficial e passa a ficar acessível ao público. ### **ETAPA 05 - Entrega final** **5.1 Envio de acessos** Após a publicação do site, envio por e-mail ao cliente os acessos ao painel administrativo, juntamente com instruções básicas de uso para que ele possa gerenciar o conteúdo quando necessário. **5.2 Encerramento do projeto** Com o site publicado e os acessos entregues, o projeto é considerado finalizado, mantendo-se disponível suporte ou manutenção conforme previamente acordado com o cliente. # Briefing para criação de site #### **1 Dados de contato do cliente** Nome do contato responsável E-mail Telefone WhatsApp (se houver) #### **2 Situação atual** Você já possui um site? Se sim, qual é o endereço? O que você gosta no site atual? O que você não gosta ou gostaria de melhorar? #### **3 Sobre a empresa** Qual é a área de atuação do negócio? Conte brevemente sobre sua empresa, produto ou serviço. #### **4 Objetivos do site** Qual é o principal objetivo do site? **Exemplos:** apresentar a empresa, gerar contatos, vender serviços, divulgar portfólio, fortalecer a marca. O que você espera que o site ajude a alcançar para o seu negócio? #### **5 Público-alvo** Quem são seus principais clientes? Eles acessam mais pelo celular ou computador? #### **6 Identidade visual e materiais** Você já possui logotipo? Sim, e posso enviar? Você poderia enviar os materiais para o seu site? Imagens ou fotos da empresa Vídeos (se houver) Textos que irão compor o site, como “Quem somos”, apresentação da empresa e informações institucionais Descrição dos serviços ou produtos Para publicação no site, informe também, se houver: Endereço completo da empresa Telefone comercial E-mail institucional WhatsApp comercial Redes sociais que deseja exibir no site, como Facebook, Instagram ou LinkedIn #### **7 Referências e concorrência** Quais são seus principais concorrentes? Se possível, indique os sites. Indique dois ou três sites que você gosta e que gostaria de usar como referência para o seu projeto. # Manual de uso do painel administrativo #### **Acesso ao Painel Administrativo** **Objetivo:** Abrir a tela de login do painel administrativo do site. **Passos:** 1. Abra o seu navegador de internet (Chrome, Edge, Firefox ou Safari). 2. Digite na barra de endereços o seu domínio completo. 3. Após o domínio, acrescente: **/admin** 4. Pressione ****Enter**** no teclado**.** **Exemplo:** > https://www.seudominio.com.br**/admin** **Resultado esperado:** Você será direcionado para a **tela de login do seu Painel Administrativo**. #### **Acesso ao Sistema** **Objetivo:** Realizar login no Painel Administrativo. **Passos:** 1. Na tela de login, localize o campo **E-mail**. 2. **Digite o seu e-mail** cadastrado no sistema. 3. Localize o campo **Senha.** 4. **Digite a sua senha** de acesso. 5. **Clique** no **botão** verde **Entrar**. **Caso não tenha acesso ou tenha esquecido a senha:** **Opção 1 Suporte:** Entre em contato com o suporte da Nuvem JTI para solicitar acesso. **Opção 2 Recuperar senha:** Clique no link **“Perdeu a sua senha?”** abaixo do botão Entrar e siga as instruções para redefinição. [![image.png](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/scaled-1680-/image.png)](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/image.png) #### **Página Inicial do Sistema** **Objetivo:** Apresentar a visão geral do painel administrativo e facilitar o acesso às principais funcionalidades do site. **Passos:** 1. Após realizar o login, você será direcionado automaticamente para a **Dashboard**, que é a página inicial do painel administrativo. 2. No **menu lateral esquerdo**, você terá acesso rápido às principais funcionalidades disponíveis para gerenciar o seu site. As opções podem variar conforme o projeto e os recursos contratados. 3. No **centro da tela**, você visualiza dois painéis informativos: 1. **Últimos Posts:** exibe os conteúdos mais recentes publicados no blog. 2. **Posts Mais Vistos:** exibe os conteúdos com maior número de visualizações. 4. No **canto superior direito**, localize o botão vermelho **Sair** para encerrar sua sessão no sistema quando necessário. 5. No **menu lateral esquerdo (última opção)**, clique em **Ver Site** para abrir o site em uma nova aba e visualizar o conteúdo como um visitante. [![image.png](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/scaled-1680-/MIIimage.png)](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/MIIimage.png) #### **Posts - Gestão de Conteúdo do Blog** **Objetivo:** Gerenciar todas as postagens do site (visualizar, criar, editar e organizar por categorias). ##### **Ver Posts (Listagem)** **Passos:** 1. No menu lateral, clique em Posts. 2. Em seguida, clique em Ver Posts. 3. Será exibida uma listagem com todas as notícias, artigos e postagens já cadastradas no blog. 4. Nessa tela você pode visualizar, editar ou revisar qualquer postagem existente. [![image.png](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/scaled-1680-/EIiimage.png)](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/EIiimage.png) ##### **Novo Post (Cadastro de Postagem)** **Objetivo:** Criar e publicar uma nova notícia ou artigo no site. **Passos:** 1. No menu lateral, clique em **Posts**. 2. Clique na opção **Novo Post** para abrir a tela de cadastro. 3. Preencha os campos principais: - **Título:** insira o título da postagem. - **Subtítulo (Resumo):** escreva um breve resumo do conteúdo. - **Links Alternativos (opcional):** adicione links extras, se desejar. - **Capa:** selecione uma imagem principal que acompanhará o título da postagem. - **Vídeo (opcional):** insira um vídeo caso queira associá-lo ao post. - **Post (conteúdo):** digite todo o texto completo da notícia ou artigo. 4. No lado esquerdo da tela, selecione a **Categoria** correspondente ao post. 5. Sobre o botão **Publicar Agora**: - Se estiver **cinza**, o post ficará como **rascunho** (somente visível no painel administrativo). - Ao clicar e deixar o botão **verde**, o post ficará liberado para publicação no site. 6. Para salvar ou atualizar a postagem, clique no botão verde **Atualizar**. [![image.png](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/scaled-1680-/SxHimage.png)](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/SxHimage.png) ##### **Categorias de Posts** **Objetivo:** Organizar e separar as postagens por temas ou assuntos. **Passos:** 1. No menu lateral, clique em **Posts**. 2. Em seguida, clique em **Categorias**. 3. Será exibida a lista de categorias já cadastradas no sistema. 4. Para **criar uma nova categoria**, utilize a opção disponível no canto superior esquerdo da tela. 5. Para cada categoria existente, você terá dois botões de ação: - **Editar (azul):** permite alterar o nome ou informações da categoria. - **Excluir (vermelho):** remove a categoria do sistema. [![image.png](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/scaled-1680-/iVzimage.png)](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/iVzimage.png) #### **Páginas - Gestão de Conteúdo do Site** **Objetivo:** Gerenciar as páginas institucionais do site (visualizar, criar, editar, publicar e excluir). ##### **Listagem de Páginas** **Passos:** 1. No menu lateral, clique em **Páginas**. 2. Você verá a listagem de todas as páginas já pré-cadastradas do site. 3. Para **editar** uma página, clique no botão azul **Editar**. 4. Para **excluir** uma página, clique no botão vermelho **Excluir**. [![image.png](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/scaled-1680-/2wDimage.png)](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/2wDimage.png) ##### **Cadastrar ou Editar Página** **Passos:** 1. Na tela de Páginas, clique em **Adicionar Nova Página** (ou clique em **Editar** em uma página existente). 2. Preencha os campos principais: - **Título:** informe o nome da página. - **Descrição:** escreva um breve resumo sobre essa página. - **Conteúdo:** insira todo o texto principal da página. 3. Na coluna lateral direita, você pode adicionar uma **Capa**, escolhendo uma imagem principal para representar a página. 4. Sobre o botão **Publicar Agora**: - Se estiver **cinza**, a página ficará em **rascunho** (visível apenas no painel administrativo). - Ao clicar e deixar o botão **verde**, a página ficará **publicada** e disponível no site. 5. Após realizar todas as alterações, clique no botão verde **Atualizar** para salvar. [![image.png](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/scaled-1680-/Uabimage.png)](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/Uabimage.png) #### **Galerias - Gestão de Imagens do Site** **Objetivo:** Gerenciar galerias de imagens do site (visualizar, criar, publicar e organizar por categorias). ##### **Listagem de Galerias** **Passos:** 1. No menu lateral, clique em **Galerias**. 2. Em seguida, clique novamente em **Galerias**. 3. Será exibida a listagem de todas as galerias já cadastradas no site. 4. Nessa tela você poderá visualizar, editar ou revisar as galerias existentes. [![image.png](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/scaled-1680-/EIvimage.png)](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/EIvimage.png) ##### **Criar Nova Galeria** **Passos:** 1. No menu lateral, clique em **Galerias**. 2. Clique na opção **Criar Galeria** para abrir a tela de cadastro. 3. Preencha os campos principais: - **Título:** informe o nome da galeria. - **Categoria:** selecione a categoria à qual essa galeria pertence. - **Galeria:** selecione uma ou mais imagens que farão parte dessa galeria. 4. Na coluna lateral esquerda, você pode definir se a galeria será **Privada ou Pública**: - Galeria privada: não aparece no site. - Galeria pública: pode ser exibida no site. 5. Sobre o botão **Publicar Agora**: - Se estiver **cinza**, a galeria ficará em **rascunho** e não será exibida no site. - Ao deixar o botão **verde**, a galeria ficará **publicada** e liberada para visualização. 6. Para cadastrar ou salvar alterações, clique no botão verde **Atualizar**. [![image.png](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/scaled-1680-/D14image.png)](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/D14image.png) ##### **Categorias de Galerias** **Objetivo:** Organizar e separar as galerias por temas ou tipos de conteúdo. **Passos:** 1. No menu lateral, clique em **Galerias**. 2. Em seguida, clique em **Categorias**. 3. Será exibida a listagem das categorias já cadastradas. 4. Para **adicionar uma nova categoria**, clique no botão verde **Adicionar Categoria** no canto superior esquerdo. 5. Para cada categoria existente, você terá dois botões de ação: - **Editar (azul):** permite alterar os dados da categoria. - **Excluir (vermelho):** remove a categoria do painel. [![image.png](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/scaled-1680-/hQWimage.png)](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/hQWimage.png) [![image.png](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/scaled-1680-/S2himage.png)](https://docs.nuvemjti.com.br/uploads/images/gallery/2026-02/S2himage.png)