Recriando o Windows XP como portfólio
(mitchivin.com)- O designer gráfico Mitch Ivin recriou seu site de portfólio no estilo do Windows XP
- É necessário que o JavaScript esteja ativado para experimentar todos os efeitos visuais e funcionalidades
- O site inteiro imita fielmente a sensação e as interações da área de trabalho do Windows XP
- Os visitantes podem explorar livremente a interface de login e elementos como o menu Iniciar, barra de tarefas e outros
- A própria experiência do portfólio destaca uma capacidade única de design de interface
Mitch Ivin — Introdução ao site de portfólio
- Mitch Ivin é um designer gráfico que implementou seu site de portfólio de forma sofisticada para se parecer com o ambiente de desktop do sistema operacional Windows XP
- Na tela inicial, os visitantes encontram elementos visuais que remetem ao uso real do sistema, como a imagem de fundo clássica do Windows XP (Bliss) e a animação de carregamento da inicialização
- O login é feito clicando em “Mitch Ivin”, e, após esse processo, o usuário pode navegar pelo site como se estivesse usando um desktop real
- A interface inclui elementos como barra de tarefas, menu Iniciar, ícone de perfil de usuário, botões de reiniciar e sair da sessão, refletindo fielmente a atmosfera e a UX do sistema original
- O site é um portfólio criativo que demonstra suas habilidades de design e desenvolvimento frontend por meio da própria “experiência”, além de servir como um exemplo divertido de interação na web
Principais funções e características
- O funcionamento completo exige obrigatoriamente JavaScript
- Usar a tela cheia com a tecla F11 aproxima ainda mais a experiência de um desktop real
- Há botões de atalho para perfis externos e trabalhos em plataformas como LinkedIn, GitHub e Instagram
- Em dispositivos móveis, há animações amigáveis ao usuário, como uma janela informando para “girar o dispositivo para o modo retrato”
- Cada ícone, botão e animação segue um design com propósito, simples e fiel à estética original do Windows XP
Estrutura da interface
Tela de desktop e login
- A tela inicial exibe a imagem de fundo do Windows XP e a animação de inicialização
- Ao clicar no ícone de usuário “Mitch Ivin”, o processo de login é iniciado
- Após o login bem-sucedido, a barra de tarefas, o botão Iniciar e outros elementos da interface são ativados
Barra de tarefas (Taskbar) e menu Iniciar (Start Menu)
- É exibida uma barra de tarefas muito semelhante à do Windows XP real
- A interface inclui botões visuais como Restart e Log Off
- Ao clicar em cada botão, as interações são apresentadas como em um sistema operacional real
Resumo
- O site de portfólio inspirado no Windows XP de Mitch Ivin oferece uma apresentação pessoal diferenciada por uma UI/UX marcante
- Em vez de apenas ver uma lista de projetos, os visitantes vivenciam um portfólio baseado em experiência direta
- É um exemplo de design de interface e branding que pode servir de referência para designers digitais e desenvolvedores frontend
3 comentários
Opiniões no Hacker News
Na verdade, gostei bastante deste projeto, acho que foi muito bem executado
Mas, como a pessoa se apresenta como "designer gráfico" e recriou o Windows XP praticamente igual, fica difícil perceber de imediato quanto ela tem de linguagem própria como designer
Olhando outros projetos abaixo do ícone do IE, dá para sentir um pouco mais da identidade dela, mas como alguns elementos visuais parecem ter sido gerados por IA, isso reduz um pouco a empolgação
A UX também é um pouco estranha; por exemplo, o controle de histórico funciona como um carrossel dentro do portfólio. Eu esperava que o botão de voltar/anterior me levasse de volta ao menu de projetos, mas não é o que acontece
Se alguém se candidatasse para mim com um portfólio desses, eu daria uma chance de entrevista. É claramente impressionante o quanto de esforço foi investido e o nível de qualidade alcançado
Mas os pontos mencionados acima, especialmente a falta de uma abordagem centrada no usuário, me preocupam, então eu certamente perguntaria sobre isso na entrevista
Só para acrescentar: eu também consigo fazer esse tipo de design. Na prática, isso é basicamente o mesmo trabalho de implementar uma proposta entregue por um UX designer, e já fiz muito isso
Tenho receio de soar decepcionante, mas, de qualquer forma, é um trabalho muito legal, eu gostei, e certamente é um portfólio que funciona bem como "primeira triagem" em muitos lugares. Só espero que a pessoa lembre que mostrar a habilidade real vem no passo seguinte
Quando você diz que realmente conseguiria fazer esse design também, e ainda afirma que não tem muito senso estético, eu queria saber se você realmente pode afirmar isso com tanta certeza
Já vi inúmeras interfaces tentando imitar o XP, e sempre havia algum elemento meio estranho
O XP do MitchIvin talvez não seja uma cópia perfeitamente idêntica, mas a experiência de uso é bem agradável
Tenho preocupações parecidas
Como projeto isolado é interessante, mas, se a ideia é ser uma réplica de XP, já existem muitos exemplos mais fiéis
Como portfólio, me parece até que o efeito negativo é maior. No design atual, é muito mais importante mostrar alguma tentativa original
Design gráfico muitas vezes é avaliado só como domínio de ferramentas ou habilidade de desenhar algo bonito, mas na verdade é comunicação: projetar visualmente uma mensagem considerando restrições, público, emoção etc.
Não existe atalho; é preciso estudar designs já feitos e praticar como mostrar o que você quer expressar com cor, layout, tipografia e imagem
Também vale desenhar com as próprias mãos, e é melhor evitar IA generativa até ganhar mais domínio por conta própria
Neste estágio, como portfólio, ainda deixa a desejar para ser memorável, e precisa de mais prática
Ainda assim, é muito louvável ter concluído o projeto e levado isso ao topo do HN; espero que essa oportunidade seja um ponto de virada e que a pessoa continue criando
Pelo fato de este site já despertar um "tenho curiosidade de conversar com essa pessoa na entrevista", eu diria que ele cumpriu o papel de portfólio
Um portfólio já basta se fizer alguém pensar "quero conhecer essa pessoa"
No fim das contas, ele serve para "bater na primeira porta"; não tem a função de conseguir o emprego por si só
Na verdade, design gráfico não é arte
É uma forma de comunicação que usa texto, imagem e layout de maneira estratégica para transmitir informação visualmente com eficácia
Originalidade importa mais em branding, questões de copyright, ou quando se reutiliza cultura existente sem critério
A pergunta mais importante é: "Por que você quer mostrar você e seu portfólio por meio do Windows XP?"
O que eu percebo aqui é, no máximo, competência técnica
Provavelmente a intenção é atingir clientes da área de tecnologia, especialmente freelancers, apelando para a nostalgia
Se eu fosse diretor de arte, não chamaria para entrevista, mas provavelmente este nem era um portfólio voltado para diretores de arte
E esse papo de "isso eu também consigo fazer" é algo muito comum em trabalhos de design
Implementação é, na verdade, a parte mais fácil do design; este portfólio naturalmente deveria parecer melhor que o XP, e é aí que está a habilidade
Ao contratar um designer, não me interessa quão precisamente ele reproduziu a estranheza do XP
Se for um desenvolvedor, é esperado que consiga implementar algo assim, então isso não impressiona
Fico bem mais impressionado quando um desenvolvedor se preocupa com boa tipografia ou layout. Na prática, o mais difícil é decidir quais elementos entram na tela e como a informação é estruturada
O segredo do sucesso está em decidir o que incluir e como estruturar isso
Eu gostaria de contratar essa pessoa
Ela tem garra, persistência e criatividade suficientes para se diferenciar dos concorrentes
Milhares de usuários do HN, os amigos deles, jornalistas de tecnologia e muita gente já curtiram esse trabalho, e ainda mais pessoas vão conhecer no futuro
Hoje em dia não é fácil conseguir emprego, mas, se você mostra esse estilo, as propostas com certeza vão aparecer
Aliás, meu portfólio também precisa de uma atualização em breve, e isso me inspirou a tentar algo parecido
Ao ler que era um "portfólio customizado em estilo XP com atenção aos detalhes", eu quis apontar alguns detalhes específicos
Se eu fosse fazer algo assim, omitiria a tela de boot e a de login. Principalmente, eu mostraria o About Me logo no início para que o cliente consiga achar isso com facilidade
Se você der um clique duplo no ícone do canto superior esquerdo da barra de título, a janela deveria fechar. Esse era o comportamento original: não maximizar ao clicar ali, mas fechar, diferentemente do corpo da barra de título
Acho que a tela de boot e a de login contribuem para o charme da recriação completa
Esse tipo de detalhe minucioso e a imersão do usuário são pontos realmente importantes em projetos de GUI
Parece mais suave do que o próprio Windows XP
É difícil explicar, mas há claramente um apelo do ponto de vista de UX/UI
Também é interessante como isso se integra naturalmente à hierarquia das abas do navegador
A tela inicial, o login e os sons, que criam uma sensação de espaço separado, conseguem dar bem a impressão de "entrar em um lugar próprio"
Seja Windows ou qualquer outra coisa, se for rápido, parece muito mais legal
Tem que responder dentro de 20ms para não dar sensação de atraso e parecer fluido
Concordo totalmente
Estou usando o beta do macOS 26, mas esse clone do Windows XP parece mais um upgrade
Porque é simples, rápido e eu já sei exatamente como usar
O Windows antigo era fraco para multitarefa por causa do single-core, mas, paradoxalmente, isso ajudava na concentração
Nos sistemas atuais, com dezenas de janelas e centenas de abas espalhadas por vários workspaces e monitores, tudo parece caótico
A nostalgia é um fator importante, mas o som de login tem algo ainda mais envolvente
Fico até curioso se você apertou logout também
A velocidade das interações da UI é muito alta
Muitas UIs modernas só deixam algumas transições rápidas, mas no conjunto têm resposta lenta, e isso acaba soando estranho
Para ser sincero, é interessante, mas parece haver algo errado na abordagem
Entrei vendo a apresentação de "designer gráfico", mas no fim parece mais uma simples cópia do design antigo de outra pessoa
A imagem de IA na tela de login e os ícones que se movem de forma estranha no mouseover também chamam atenção
Não me lembro de efeitos assim no Windows XP, então fiquei até na dúvida se seria algum bug esquisito
A partir daí, minha confiança começou a cair
Sendo um "designer gráfico", usar gráficos gerados por IA me fez pensar se o código também não teria sido delegado de forma parecida
A forma de mostrar o currículo como um PDF falso também parece frustrante
Vários projetos ficam presos em janelas pequenas e difíceis de ver direito, e dois deles só mostram animação de carregamento
A pessoa disse que não tinha experiência prévia com programação, recebeu ajuda de agentes de IA e que "todas as decisões foram humanas", mas, se ela não tinha habilidade para escrever o código sozinha, será que o controle real das decisões não ficou mais com a LLM?
Também fico curioso se ela conseguiria refazer esse projeto do zero por conta própria
É um projeto interessante e legal, mas, como portfólio, infelizmente parece acabar subestimando a habilidade da própria pessoa
E já existem muitos casos parecidos win32.run
Eu tinha tentado postar isso antes e fiquei triste porque não deu certo
Agora fico feliz em ver todo mundo curtindo
Como acabei de entrar no HN, quero ganhar um pouco de karma também
(sou o moderador)
Repostei o seu Show HN original e também juntei os comentários
Marquei sua conta como normal para você não precisar se preocupar em cair no filtro de spam
Acabamento excelente! Acho que você capturou muito bem a estética do XP e até o espírito daquela época
Se realmente existisse um app profissional de "geração de portfólios" para Windows XP e ele produzisse algo com esse nível de qualidade, todo mundo provavelmente reconheceria isso como um produto incrível e bonito
É um ótimo trabalho que mostra sua habilidade e, ao mesmo tempo, recria a beleza do Windows XP de forma contemporânea e histórica
Ficou bom demais! Trabalho incrível
No meu navegador (Chrome 138, Windows 10), o menu Iniciar fica alguns segundos, aparece rapidamente e já some
O nível de acabamento é altíssimo, resultado excelente mesmo
Como usuário de XP, eu realmente gostei muito deste trabalho
Só sendo um pouco preciosista
Eu vejo isso como uma homenagem, ou seja, um caso de pegar a estética clássica do Windows XP e refiná-la com uma expressão nova da época
Reinterpretar e dar continuidade à arte e ao estilo dessa forma, respeitando as raízes, é um jeito comum de a sensibilidade estética evoluir
Aba da barra de tarefas: observação justa, e investi um tempo enorme tentando acertar essa parte
No fim, ainda há uma pequena diferença, mas acho que ficou bem parecido
O resto foram escolhas estéticas intencionais. Na verdade, acho que ninguém comentou uma das maiores diferenças
Quando você faz seleção por arraste nos ícones da área de trabalho, o destaque fica muito mais próximo do Windows 11 do que do XP
Eu queria melhorar isso no futuro
Esse trabalho é muito legal, mas acho que deixa a desejar em dois pontos
O primeiro é que não passa completamente a sensação de "computador". Por exemplo, se ao digitar "dir" na linha de comando surgisse alguma interação divertida, seria bem mais interessante
O segundo é que a qualidade do conteúdo dentro do portfólio não acompanha a qualidade desta página. O site é muito bem-feito, mas, quando você vê os outros trabalhos da pessoa ali, tudo parece simples e vazio demais
Ainda assim, no geral é um bom projeto
Trabalho realmente muito legal
Toda vez que vejo, fico com saudade do estilo do Windows XP
O XP foi o único Windows que realmente tentou ser "divertido", a ponto de colocar até um cachorro mascote nos resultados de busca
A barra de tarefas embaixo também parecia um brinquedo da Fisher Price, e eu sinto falta do Clippy
Dá saudade da época em que software profissional podia se permitir esse tipo de leveza
E, aliás, o estilo do avatar da pessoa lembra Simpsons ou Bob's Burgers, o que ficou marcante
É um trabalho impressionante, mas acho que precisa de uma reflexão mais profunda
Existe uma tensão fundamental entre cópia e criação
Claro, muitas obras criativas partem de moldes já existentes. Por exemplo, romances policiais costumam ter cadáver, garrafa de bebida, falas espirituosas e outros elementos quase formulaicos. Mas a verdadeira arte está em reinterpretar essa estrutura do seu próprio jeito
Você pode deixar a IA cuidar da linha da história, mas escolhas, voz, atrito e a verdadeira "presença" ou alma precisam vir da pessoa
Aqui sinto falta dessa "presença"
O projeto é bem-feito, mas no fim é apenas Windows XP: bonito, porém plano
Respeito o esforço e o processo de aprendizado do autor, mas ainda assim passa sensação de "cópia"
Se eu fosse o protagonista, veria isso como um primeiro passo. "Terminei a cópia; agora o que posso melhorar? O que posso mudar, arriscar? Será que não daria para mostrar um antes e depois?"
O verdadeiro ponto é: por que parar no simulacro? Por que não ir além do limite da reprodução, melhorar, expandir e tornar isso seu?
Ao colaborar com IA, em meio a infinitos templates e iteração rápida, vale pensar seriamente em como mostrar seu diferencial — ou sua "alma"
(Aliás, também revisei este texto com Grammarly; isso me lembra a famosa frase: "um homem precisa conhecer seus limites")
Um projeto maior e mais expansivo, junto com um projeto de cópia limpo e memorável: essa combinação pode ser mais atraente para quem está passando rapidamente por vários portfólios
Ainda assim, concordo que o portfólio precisa, no fim, ser equilibrado e diversificado
Gostei bastante
Só para implicar com alguns errinhos de XP
Vejo isso como uma bela homenagem ou uma interpretação moderna de um estilo clássico
É uma evolução autêntica que combina uma estética clássica com sensibilidade contemporânea sem perder as raízes
Aba da barra de tarefas: observação correta, e eu realmente investi muito tempo nisso, mas não consegui deixar totalmente idêntico, então em certa medida aceitei a diferença
O resto foi tudo decisão estética. Na verdade, há uma coisa que ninguém comentou: ao fazer seleção por arraste nos ícones da área de trabalho, o visual fica muito mais próximo do Windows 11 do que do XP
Pessoalmente, eu também achava que isso precisava mudar
É uma obra muito legal, mas falta um pouco daquela sensação de ser um "computador" de verdade
Por exemplo, se houvesse uma pequena interação ao digitar
dirna linha de comando, seria muito mais divertidoEm segundo lugar, a qualidade do conteúdo do portfólio é simples demais e não combina com a qualidade do site
No geral, continua sendo um bom projeto
Trabalho realmente muito legal
Sempre que vejo, sinto saudade do estilo da era Windows XP
O XP foi o único Windows que perseguia a ideia de ser "divertido", com o cachorrinho fofo, a barra de tarefas parecendo brinquedo da Fisher Price e o Clippy, tudo cheio de senso de humor
Dá saudade daquela época em que softwares profissionais podiam ser assim tão descontraídos
E o avatar em estilo Simpsons/Bob's Burgers também é marcante
Este projeto é realmente muito bom
Mostra bem as habilidades da pessoa, a capacidade de aprender, a persistência e a atenção aos detalhes
Ao contrário de quem critica por ser uma cópia ou por pequenos erros nos detalhes, eu não acho que esse seja o ponto principal
É um projeto muito legal, parabéns
Olá, sou um desenvolvedor backend que está desenvolvendo um portfólio muito parecido com este post. Ainda estou finalizando alguns ajustes,
então resolvi deixar um comentário para ver se eu também poderia receber um feedback sincero.
Se não houver problema em fazer um comentário assim, vou postar o link do portfólio.
+) E também é minha primeira vez aqui, então queria saber se usar um estilo de escrita mais informal e conciso é a regra.
Não precisa fazer isso. Por favor, peço que você, desenvolvedor, não faça isso. Na verdade, dá até vontade de morrer de tão desagradável de ver, mas há muitas informações úteis e eu só assisto, por mais repulsivo que seja, porque esse jeito de ficar fazendo "hum, hum" é um meio que eles usam para transmitir informações de forma eficaz. Eu agradeceria se vocês compartilhassem informações em frases bem formuladas.