DEV Community

Cover image for Windows 12, but for Web
Abdul Rehman
Abdul Rehman

Posted on • Updated on

Windows 12, but for Web

Windows 12 ui Design using HTML,CSS, JS

Hey Devs,
From few days after making Windows 11 design i tried my best to make Windows 12 ui.
I make it by using Html,Css,Js
As a beginner, I tried my best in it.

Live demo : https://window-12.netlify.app/

You can also try Windows 11 is it also a very awesome project.

Window 11 dev_to: https://bit.ly/3FdcPij
Window 11: https://window-11.netlify.app/

By :Abdul Rehman

About Me:
I am 14 years old boy From Lahore, Pakistan. I am interested in things related to computer and internet. I started my journey as a Web Developer From April, 2021 and start learning web development from YouTube and created Windows 11 clone that is really awesome please Try once. I make Windows 11 on my PC(Which is too much slow) with 2gb ram and 32gb HDD.
Thank You.
I need your support.
Your one comment is a source of motivation for me.

Top comments (43)

Collapse
 
jeremymonatte profile image
Mbenga • Edited

honestly the development work is really good. A big thumbs up.

On the other hand, I think that imagined the interface of a potential Windows 12 could be too ambitious. It's a different job than being a developer, where you seem genuinely good at. This is a very thorough job of ui / ui designer. And we can find small flaws in this ux / ui work.

For example I think it is unlikely that windows 12 readopt the bar fixed to the left while windows 11 pushes the bar centered. Similarly, it is unlikely to see applications like "groove music" when its support is already decreasing (yes I know it is very precise as a default but it is this kind of point that makes the diference between a cool project, andan excellent project).
Likewise, it is probable, given the direction taken by windows 11, that interactions lead to ever smoother animations, whereas on your project we find a lot of change of aspects without real transitions. Finally, the differences in vertical alignments in the task bar appear to be a fairly notable defect.

Okay it's time to jump to the conclusion, and I know my comment sounds harsh. But in truth I am quite admiring. It's a really great job, especially for someone so young. You really have potential and I want to encourage you. I think you can become a really good dev. If I have brought you so many points that appear to be flaws, it is above all because everything else is very, very clean. Suddenly, the defects are necessarily visible. My conclusion will therefore be: "BRAVO"

Collapse
 
whippingdot profile image
Sanjaay R.

Amazing response I agree with everything (thought I don't understand the vertical alignments thingy)

Collapse
 
jeremymonatte profile image
Mbenga • Edited

what I meant was than if i draw the line of the icones' top and bottom (windows and middle ones), the ones of the searchbar, the is a lot of line.
Lines of alignment

Ideally, it should have one at the botom of both icons, serach bar and notif block on right, on for the top of those elements, and of for both text and icon of the searchbar

Collapse
 
rehman0 profile image
Abdul Rehman

Thank you

Collapse
 
davido242 profile image
Monday David S.

This is awesome Abdul.... keep it up! It's usually tough in all great begginings!

Collapse
 
rehman0 profile image
Abdul Rehman

Thank you

Collapse
 
roxlukas profile image
Łukasz Poźniak

Amazing work and I encourage you to continue your work. I started my web dev journey at roughly the same age and it's great you are already way better than I was :-) You will certainly learn a lot if you follow mbenga's advice :-) good luck!

Collapse
 
rehman0 profile image
Abdul Rehman

Thank you

Collapse
 
code_with_ali profile image
AlixaProDev

Wooo. This is so cool.
You will grow so much faster.

Collapse
 
rehman0 profile image
Abdul Rehman

Thank you

Collapse
 
yinkamac profile image
yinkamac

Nice work , Keep it up 👍

Collapse
 
rehman0 profile image
Abdul Rehman

Thank you

Collapse
 
thisisazeez profile image
Abdul Azeez

Biggest Thumbs UP! Great Work

Collapse
 
rehman0 profile image
Abdul Rehman

Thank you

Collapse
 
thisisazeez profile image
Abdul Azeez

The Pleasure is all mine Keep it Up my Brother

Collapse
 
khalidsaifullahfuad profile image
Khalid Saifullah Fuad

Very impressive. Keep it up. 👍

Collapse
 
rehman0 profile image
Abdul Rehman

Thank You.
Have a nice day

Collapse
 
atlx profile image
λtlas

Great job! I can tell it took a lot of hard work.

Collapse
 
rehman0 profile image
Abdul Rehman

Thank You

Collapse
 
ddasb profile image
Damien Da Silva Bregieiro

You can accept and upgrade to Windows 11, it's free ;)
Windows 11 is not currently compatible with all computers, installing windows 10 first may be a better choice

Collapse
 
1link profile image
1Link.Fun

👍

Collapse
 
harryadney profile image
Martin Dimmock

It's so inspirational seeing a young designer/developer take their first steps in this industry. Well done.

Collapse
 
rehman0 profile image
Abdul Rehman

Thank you

Collapse
 
walterwoshid profile image
WalterWoshid

My friend, you are 14 and you accomplished such a great thing. You have my greatest respect. Keep up your work!!!

Collapse
 
rehman0 profile image
Abdul Rehman

Thank you
Thank you
Thank you

Collapse
 
abhishekbedi profile image
Abhishek Bedi

Hi Abdul,
Great work. People like you inspire us all ! Developing with 2GB of RAM? That shows your dedication to learn, keep up the good work.

Collapse
 
rehman0 profile image
Abdul Rehman

Thank you
Thank you
Thank you

Collapse
 
jzombie profile image
jzombie

Keep up the great work.

Collapse
 
rehman0 profile image
Abdul Rehman

Thank you

Collapse
 
rehman0 profile image
Abdul Rehman

Thank You.
Have a nice day