
Solution retrospective
a lot of research
Please log in to post a comment
Log in with GitHubCommunity feedback
- @codebyneander
A solução apresentada por esse usuário, com todo respeito, falha justamente naquilo que o desafio da Frontend Mentor mais valoriza — atenção aos detalhes, acessibilidade e design responsivo e polido. Aqui vai um feedback técnico e direto, com sugestões para qualquer iniciante que queira realmente evoluir:
🧊 Feedback direto: Um banho de realidade
❌ Problemas observados:
-
Design desalinhado com a proposta do desafio
- O layout parece não seguir o design original disponibilizado. As proporções da imagem, espaçamentos e botões estão visualmente desbalanceados e grosseiros.
- Há excesso de margem preta em torno do componente, como se o conteúdo tivesse sido largado no meio da tela sem intenção visual.
-
Experiência do usuário (UX) ruim
- Os botões são visualmente pesados, sem contraste definido, e aparentam não ter feedbacks de interação bem definidos (hover, focus).
- A ausência de espaçamento entre os botões passa sensação de amadorismo. Layout visualmente sufocado.
-
Acessibilidade comprometida
- Falta de contraste adequado (fundo preto + botões escuros).
- Possivelmente sem foco visível nos elementos interativos (não dá para ver, mas suspeito).
-
Responsividade possivelmente ausente
- Não há indício de um trabalho bem-feito para mobile-first ou adaptabilidade de tela.
✅ Como corrigir e evoluir de verdade:
-
Siga o design original com precisão.
Abra o arquivo no Figma (ou o PNG) e observe: tamanhos, cores, espaçamentos e comportamentos de hover. Isso vai treinar seu olhar de desenvolvedor.
-
Pense como um usuário. Você clicaria nesses botões e se sentiria satisfeito? Se não, é hora de rever a forma como entrega componentes interativos. Use transições suaves e cores bem definidas para indicar interação.
-
Aplique boas práticas de CSS.
- Use padding, gap, border-radius e hover:transition de forma inteligente.
- Não exagere no "margin: auto" centralizando tudo sem critério. Centralizar exige harmonia visual, não só CSS.
-
Não entregue "qualquer coisa".
Frontend é sobre detalhes. Um projeto simples como esse precisa ser perfeito. É um cartão de visita do seu capricho. Se você faz um projeto com 7 botões e 1 avatar e mesmo assim ignora qualidade visual e acessibilidade, o que fará em projetos maiores?
🔁 Conclusão:
Não é sobre te desmotivar. É sobre te dizer a verdade: o mercado não aceita desleixo, nem projetos jogados de qualquer jeito. Você precisa desenvolver seu olhar crítico. Refazer esse projeto com atenção ao detalhe vai te ensinar mais do que assistir 10 tutoriais seguidos.
-
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord