Posted by mitchivin 6 days ago
I started from zero knowledge and spent months collaborating with AI agents as a learning experience. Every pixel and every function went through me. The AI translated what I asked for into code, but every decision was human. I didn't use existing OS frameworks because the goal was learning how basic coding languages worked while also developing my skills with AI collaboration. Apart from basic libraries like xp.css and paint.js, it's all original code.
The result is a fully functional Windows XP recreation running in your browser. Complete experience with sounds, animations, and working applications. Even works properly on mobile, which required rebuilding everything to maintain the authentic feel without becoming unusable on touchscreens.
This project taught me more about coding and AI collaboration than I ever expected. Would love to hear your thoughts on the execution and any feedback on the technical approach.
But the problem with you billing yourself as a graphic designer and reimplementing Windows XP is that you’re copying a design that already exists rather than showcasing your own design skills, so I can’t immediately tell how good a designer you are[0].
I can look at your projects under the IE icon, which gives more of an impression, but some of the visuals there do look decidedly AI generated, which isn’t super-encouraging.
The UX is also weird. For example, the back/forward history controls behave like carousel controls through your portfolio, whereas when I hit back/previous I expect to be taken back to the menu of projects.
If you applied to me for a job with this, would I interview you?
Yes, I would, simply because I can see you’ve put a lot of effort in and created something high quality. But I’d have some reservations because of the concerns I’ve raised above and, in particular, I’d want to dig in to how user-centred your approach is, because that isn’t really demonstrated here.
Sorry if this sounds discouraging. What you’ve done is cool, and I like it, and it would certainly get you a foot in the door of many interview processes, but that will be when the real work of showcasing your skills begins.
I hope that makes sense?
[0] Literally, I could do this, and I suck at design. It’s very similar to the process of implementing a design passed to me by a UX Designer, which I’ve done loads of times.
Are you sure about that? I've seen plenty of imitation XP interfaces in my day, and there are virtually always elements that are jarringly wrong. While I won't claim that MitchIvin XP is a faithful reproduction of XP, in the sense that one could compile a long list of inconsistencies with Windows XP, the experience is pleasant enough.
Pretty much most days I am the person who is taking a design from a designer and reimplementing that in HTML/CSS. I couldn't tell you where to start when creating a design, but as far as taking something someone else has created and reimplementing it in code? I can do that all day long.
The visual guidelines PDF exists http://interface.free.fr/Archives/GUI_Xp.pdf and turning that into a web page is just a matter of creating some DOM elements with the right sizing, margins, padding, fonts, borders, etc.
As a portfolio, I think it doesn't work at all and is detrimental to what you're trying to do. I think now in design, it is more important than ever for your work to cut through the noise and show at least some attempt to create something original.
I think sometimes graphic design is seen as competence with certain programs, which I guess includes genAI now, or making something cool - but really it is visual communication that responds to a set of constraints - e.g. a brief, tailored to a target audience, communicating a product or emotion. There are no shortcuts - study what has been done, work on communicating what you want to say with colour, layout, typography and images. Draw and paint; avoid genAI until you are competent without it. Currently as a graphic design portfolio, I'm sorry to say it is memorably bad and there is a lot of work to do.
That said, well done on finishing something, and making it to the top of HN. I hope the attention leads somewhere and that you continue making things.
The reality is, it depends on the context of whom is hiring. A startup values things like being resourceful and finishing stuff vs a large firm wherein most projects get dumped anyway.
From what I've seen, at least half of design work is "make it look like x" where x may be "glass", "CRT effect" or "BigCo's design language".
This project looks like some light-hearted fun and demonstrates an ability to achieve a desired look. You seem to be looking for someone doing greenfield design work for a large advertising agency.
I see nothing in your profile that indicates any expertise in design, so it's really bold of you to level this kind of criticism at someone's project.
Again, you have zero design credentials in your profile. You don't dictate what design is and is not.
All the best to you both.
Personally, I find this idea alone to be very creative. Isn't a great designer someone who weaves together countless mediocre ideas to form a truly creative concept?
Then the site satisfied its purpose. A portfolio site should get you an interview with someone who is curious to know more. Its purpose is to be a foot in the door, not to get you the job.
Ive been needing to update my portfolio site as in August an out of nowhere opportunity knocked on my door. Seeing this makes me want to innovate my portfolio for said opportunity(thanks for the inspiration).
The much more important question for a graphic designer is: what exactly are you trying you communicate about yourself and your portfolio by invoking windows XP? Because right now, technical competence is about the closest I can get and I really don’t see the association. I think what they’re probably trying to do is evoke nostalgia among potential tech industry clients as a freelancer, and to be fair, the intended audience is always a big part of the equation.
If I was art directing, I probably wouldn’t bring them in for an interview — but I’ll bet they aren’t advertising themselves to art directors.
> Literally, I could do this
The classic refrain. Implementation is the easiest part of design work. It looks better than XP did, and it should— that’s one key skill that a designer should have. Nobody hiring a designer will care if they can accurately recreate the wonkiness of XP’s interface. And nobody is impressed that a developer can implement this because that’s a developer’s job. I’m genuinely impressed when a developer’s website has solid type design and a thoughtful informational hierarchy, but that’s not even the bare minimum required fora designer. Having done both, I think deciding exactly what goes on the screen/paper is the harder part. It takes longer and you’ve got a much more nebulous path to success.
as if everything isn't just a copy of something else
Here goes:
1. "Welcome" on the login screen should be lowercase
2. Balloon is too high (should touch the icon), close icon is too small (should be roughly the same height as the balloon title)
3. About Me is missing the scrollbar on Firefox
4. Wrong gradient for "Social Links"
5. Start menu should have a shadow
6. In My Projects, two tiles are loading forever
7. Windows that cannot be maximized, but can be minimized, should have all three buttons, with the middle one disabled
8. Paint did not have the Windows logo in the corner. It would be better to show the JSPaint menu bar to make things like Undo accessible, and the JSPaint authors deserve attribution.
9. "Git Co-pilot" is not a thing, as Git ≠ GitHub. (On the XP project page.)
If I were making something like this, I would probably skip the boot and login screens (certainly would not require user interaction; indeed, XP would automatically log you in if you had a single passwordless user), and show "About Me" on startup, so that potential clients don’t give up before they learn more about you.
Too bad most new Windows 10+ apps don't support that anymore.
Another interesting aspect of this particular implementation is that it blends naturally with a browser tab hierarchy, it does not try to overrule it, it just blends in. Probably thanks to a distinctive taskbar, or maybe it is due to the startup screen/login/sound that set up a distinctive boundary "you are here now, and this is a friendly place to be".
Very fast response time for the UI interactions. "Modern" UIs can have a few fast transitions but the overall interactions with the different components have a human noticeable lag that make them uneasy.
Everything under 150 ms is pretty much indistinguishably fast to a normal person.
Working with soft synths, the difference between 65ms, to 15ms latency, 8ms latency, and 2ms latency - time from pressing the key to speakers emitting the sound - is agonizingly noticeable.
The numbers I’m quoting are ones I remember from various gear and upgrades over the years. It’s crazy to think about the levels of latency I was stuck with when I was a poor college kid. These days I wouldn’t settle for more than 10ms latency, and I don’t have to, thank the maker.
When a drummer plays drums all the hits are off-timing 10-40ms, and it is still considered natural-sounding swing, if it is agonisingly noticeable for you – you have a quite robotic sense of rhythm, it's very subjective after all.
I am aware there could be something like a non-linear alpha animation, and so there could be a period of time where the alpha is so little, and it accelerates so slowly, that I could miss the first 100 ms of it - but then again because I'm experienced in gui programming, I would consider that.
For the most part people are just bad at optimizing gui, especially in HTML.
You're trying to bring in continuous changing of frames here which is obviously perceived differently.
edit: I'm new here! let me get some of that sweet sweet karma!
I've also marked your account legit so it won't get misassessed by those nasty spam filters in the future!
If Windows XP had had some kind of super professional “create a portfolio” app that would output an executable binary that you could download it would’ve been lauded as amazing and beautiful if it looked like what you created.
This is great. It shows your skills, but also brings back the beauty of Windows XP, in a contemporary but historically accurate format.
After reloading the page and leaving the CRT effect on, it worked once (the first time) then not.
Reloading the page and turning the CRT effect off immediately, it seems to work every time, but flickers.
You are going to be a wealthy man very soon now from all that karma.
I opened the page before reading your post, and what immediately jumped out at me is that you say you’re a graphic designer but then you’re copying someone else’s old design which isn’t even that good.
The second thing I noticed was the obvious AI icon for the login, and that hovering on it makes it move weirdly. I haven’t used Windows XP in over two decades but don’t remember it doing that. It looks like an error.
At that point, I started losing confidence. You are supposed to be a graphic designer but are obviously using AI to design graphics and I assumed you would be doing the same for the code.
The resume as a fake PDF is cramped and zooming in feels like a poor solution.
Same thing with your projects, I can’t view them properly because they’re shoved in a tiny window for no reason. Plus, two of them are just loading animations, and it’s hard to understand if they’re broken or will ever load.
Then I finally read your post. You say you had no coding experience and used AI agents and “every decision was human”, but if you don’t know how to code, most of the decisions will have been made by the LLM even if you instructed it in particular ways. Do you feel confident regarding what you ostensibly learned and that you’d be able to reimplement most of the project yourself from scratch?
Again, it is interesting and a cool project, but it’s not particularly well-made or original¹ and I feel that as a portfolio actually does you a disservice by showcasing your skills in the worst possible light.
The core tension is between replication and creation. Yes, some things will always resemble what came before. A hard-boiled detective novel usually has a corpse or two, a bottle, and a wisecrack. But the artistry and work are in what you do with the formula. Take Les Roberts, for example. He wrote detective novels, sure, but he set them in Cleveland, gave them local color, and turned Northeast Ohio into a character. That's authorship. That's presence.
You can absolutely ask an AI to plot the story. But the soul, that point, is what you bring to it: the choices, the voice, the friction.
What gives me pause here is that I don't feel that presence. The project looks good, but it feels like Windows XP. Smooth, clean, and generic. I can't tell what this person's actual skills are. From the post, they clearly put in real time and effort. They learned something and got it working. But what I see is replication. Competent, yes. But flat, in my opinion.
If I were in their shoes, someone who would struggle to replicate this, I'd still treat that as step one.
Okay, I copied it. Now, what can I improve? What parts of the interface feel off? Where could I take a risk? Then, show the before and after.
So here's the long-winded point.
Why stop at imitation? Why not go further? Why not show that you can replicate something, build on it, shape it, and own it?
That's the more profound concern I have about AI collaboration. How do you show your work in a world of infinite templates and effortless iteration? How do you show your soul, or if you are too shy to bare your soul, at least a differentiator, that means you should be hired?
(I say this with the absolute irony that I used Grammarly to ensure this collection of words somewhat resembled a coherent thought. In the words of Dirty Harry, "A man has to know his limitations."[0]) ---
[0] Probably a misquote.
Having one deeply extended project and one memorable clean recreation (it's getting upvotes, seems like a novel enough idea) is probably more unique than two mildly extended projects, if I were to hazard a guess into what people ripping through dozens of portfolios are thinking.
You are probably right that the portfolio needs to be rounded out though and that this project shouldn't stand alone.
If anything it’s the best motivation I could have to raise the quality of all my work though
- The taskbar tabs are slightly off from how they looked in the real XP (must be the borders? It's the same issue with the windows as well).
- The close/maximize/minimize buttons never had hover transitions
- By default, desktop icons didn't have any hover effects in the real XP
- I'm surprised you didn't recreate the XP mouse cursor!
- IE6:
- The address bar didn't show progress
- The buttons in the toolbar at the top never had any transition effect on hoverPersonally, I've used XP a lot back in the day, but don't remember much of the details like most users are reporting here, so I really liked to play with your website, and would definitely hire you if I was in such position.
Good luck!
Maybe they could have a fake "patch note" file within the virtual OS which frames it as a hypothetical service path upgrade (which showcases that OP does realize the slight variations in their design, while also showcasing that they can do technical writing)
Maybe styled like a word doc or something
the rest, are all aesthetic decisions haha but I was aware of some of them - I'm surprised you missed the biggest one of them all though.. also that nobody else has mentioned it yet - maybe its because nobody has tried it
the drag selection over desktop icons highlights the icons in a way much closer to windows 11 than XP... i really just thought it deserved an upgrade
edit: did i miss it or did you just add the thing about selection? you're right though
Every time I see it, a part of me misses the styling of Windows XP. It was kind of the only well-regarded windows that tried to actually be fun; the fact that there was a little dog mascot in the search results, the fact that the bar on the bottom kind of looks like a Fisher Price toy, Clippy!
I kind of miss when professional programs were allowed to be goofy.
As a side note, I really like your avatar; has kind of a Simpsons/Bob's Burgers vibe that I find appealing.
The other thing is, I think the portfolio doesn't really match the quality of the website you vibe coded. This is actually a pretty bad sign that your own work is not as good as something you can do with AI (human assisted or not). The website is pretty high quality, so browsing through extremely simple assets just feels out of place.
Overall it's a good project.
Great site, thanks for nostalgia!
That person is incorrect. WinXP started selling at retail in Oct 2001. I started using it at work in early 2002 and as a senior employee in a tech company I had a pretty deluxe 21-inch Viewsonic CRT which ran at 2048 x 1536 resolution. That Viewsonic cost $1600 new in 2000 and looked great. The company didn't upgrade to flat screens until about 2006 when the Viewsonic was replaced with a 20-inch Dell 2005fpw with native 1680 x 1050 resolution for $800. That's the year Windows Vista came out.
Even in 2006 corporate priced LCDs at the 20-inch size didn't look quite as good as the high-quality CRT I switched from. In some ways (like sharpness) a good LCD could look better but in other ways (like contrast) it wasn't as good yet - so it was still a mixed bag. About 2004 the company started buying newly hired entry-level employees 15 or 17-inch LCDs but they were typically 1024 x 768 and the quality wasn't great. A designer like you would definitely have stuck with a CRT longer both for quality and screen size at a reasonable price.
As a former Windows XP user: this is amazingly detailed and well done! The CRT effect is spot on for me.
Well, not really, and it depended highly on the place of work/study and country/state. For example, my University replaced the CRT ones with LCDs only in 2005-06 (they've used XP in computer rooms for quite a long time, skipping Vista and 8).
I myself used the CRT monitor with winXP until the late 2004.
I used my mom's iMac G3 (CRT) probably until 2004 or so, because I distinctly remember getting stuck on Tutorial Island on RuneScape as a kid, since you had to Right-click -> "Prospect Rock", and at the time, I had no idea how to actually do it with Apple's single-button mice lmao.
Aside from the couple of laptops that came later, I don't think I had moved on [for the worse] until a bit after I put together my first DIY computer (Phenom II 920, etc); I still had a CRT TV in my room long enough to have been using it when Halo Reach came out.