An open API service indexing awesome lists of open source software.

https://github.com/nashem8/shoop

🔹 Projeto loja virtual com Bootstrap do curso de UX/UI Desinger promovido pela Nubank em parceria com a Descomplica
https://github.com/nashem8/shoop

bootstrap css font-awesome html

Last synced: 3 months ago
JSON representation

🔹 Projeto loja virtual com Bootstrap do curso de UX/UI Desinger promovido pela Nubank em parceria com a Descomplica

Awesome Lists containing this project

README

        

# Shoop - HTML, CSS e Bootstrap: Atividade Prática



🔹 Projeto loja virtual com Bootstrap do curso de UX/UI Desinger promovido pela Nubank em parceria com a Descomplica



🔎    Link para visualização: shoop.netlify.app


  • Título da Prática: Aplicação do uso do bootstrap, cards, carousel e imagens em um documento HTML

  • Objetivo: O aluno precisa identificar, codificar as propriedades disponíveis do bootstrap e aplicar em um documento HTML para reproduzir o site especificado

  • Materiais, Métodos e Ferramentas: O aluno precisa ter uma IDE de desenvolvimento de site para poder codificar e visualizar o layout HTML especificado. O software indicado para isso é o visual
    studio code. Contudo, pode ser utilizado qualquer IDE.



📝  Atividade Prática




Nessa atividade prática você deverá criar um site como uma vitrine de uma loja virtual. Use a sua
criatividade e explore o que pode ser desenvolvido para criar uma loja virtual atraente. Dando uma dica, pode
ser feito um site de venda de roupas ou um site de venda de tênis. Você tem a liberdade de escolher o que seu
site irá vender. O site deve ser composto por 6 seções: A barra de navegação, um carousel, quem somos,
nosso time, nossos produtos e um rodapé. Na barra de navegação, deve ter os links que direcionam para
seção quem somos, nosso time e nossos produtos. Na seção do carousel, escolha quatro imagens sobre o
produto ou da loja, algo que desperte o desejo do cliente continuar navegando no seu site e cada imagem
deve ter uma frase de impacto. Na seção quem somos, coloque um texto e uma imagem para falar sobre a
empresa. Faça uma diagramação que fique interessante e desperte o interesse das pessoas lerem. Na seção
nosso time, aproveite e coloque fotos arredondadas de pessoas. Dando a ideia de quem é o time da empresa.
Na seção nossos produtos, explore o uso de cards colocando uma foto do produto, um texto abaixo da foto
sobre o produto e também não deixe de informar o valor do produto. Nessa seção, coloque, pelo menos, 6
produtos. No rodapé, informe o endereço, telefone e as redes sociais da empresa.



⚙️  Resolução:





🛠️   Tecnologias utilizadas


 🔺   HTML

 🔺   CSS

 🔺   Bootstrap