Escolha do Desafio
Explorei os desafios propostos e escolhi um na área de Front-End: criar um cartão de produto para um e-commerce usando HTML e CSS. Achei a ideia perfeita para praticar minhas habilidades e, ao mesmo tempo, ter um projeto visualmente atraente para o meu portfólio.
Pesquisa de Orientações com a IA
Para começar, usei o ChatGPT para me orientar. Formulei o seguinte prompt:
"Preciso criar um cartão de produto para um e-commerce usando HTML e CSS. Me dê um passo a passo para a estrutura do HTML e sugestões de estilo em CSS para que o cartão seja moderno e responsivo. Inclua dicas sobre como organizar o código."
O ChatGPT me forneceu uma estrutura básica para o HTML, com divs para a imagem, título, preço e um botão de compra. Para o CSS, ele sugeriu o uso de Flexbox ou Grid para o layout, além de propriedades como box-shadow, border-radius e transições suaves para o botão, o que me ajudou a pensar em um design mais polido.
Implementação da Solução
Com as orientações da IA, comecei a codificar.
HTML: Estruturei o código exatamente como sugerido, criando classes semânticas como .product-card, .product-image, .product-title, .product-price e .buy-button.
CSS: Apliquei as sugestões de estilo para o layout, usando display: flex para alinhar os elementos. Adicionei sombras sutis, arredondei as bordas e usei hover para criar uma animação no botão, tornando a experiência do usuário mais interativa. Usei uma media query para ajustar o layout em telas menores, garantindo a responsividade.
Ajustes: Durante o processo, usei a IA novamente para me ajudar com um seletor CSS que eu não estava conseguindo aplicar corretamente. Ela me forneceu o trecho de código exato que eu precisava.
Compartilhamento e Discussão
O resultado final foi um cartão de produto funcional, moderno e responsivo, que superou minhas expectativas. A IA atuou como uma colaboradora, me fornecendo um ponto de partida sólido e me ajudando a resolver problemas específicos durante a implementação. Compartilhei meu projeto no fórum do "7 Days of Code" e também no meu GitHub. A experiência me mostrou que a IA não substitui o desenvolvedor, mas é uma ferramenta poderosa que potencializa a criatividade e acelera o processo de aprendizado.
Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!