最近、昔のOSデザインってなんか可愛いなあって思うことがあって💭
特にWindows 98のあの四角いウィンドウとか、シンプルだけど味がある感じ…なんか気になるんだよね✨
そんなわけで、ある人がReactとTailwind CSSを使って、Windows 98風のポートフォリオサイトを作ったっていうのを見つけたんだ💡
リンクはこちら👉 https://adriancrosby.com
どうしてWindows 98スタイル?
普通のモダンデザインって、丸みを帯びてたり、アニメーションが派手だったりするけど、Windows 98のUIは直線的でシンプル。
それが逆に目立つし、懐かしさもあって、見てるだけでちょっと楽しい気分になるんだよね🌸
ReactとTailwindでどう作ったの?
このポートフォリオ、Reactで動的に動かしてるのはもちろん、Tailwind CSSを使ってレスポンシブ対応もバッチリにしてるみたい。
1人でReactとTailwindを組み合わせて、ちゃんとスマホでも見やすく作るのって、けっこう大変だと思うけど、見た感じちゃんと考えられてるなあって思ったよ👍
ポイントは「シンプル&直感的」
Windows 98っぽいUIはごちゃごちゃしてなくて必要な情報だけ出してる感じだから、サイトも見やすいんだよね。
無駄を省いて、使いやすさを優先してるのが伝わってくる✨
わたし的に気になったところ
- ボタンやウィンドウの枠が昔のままっぽくて、ちょっと懐かしい気持ちになる🥺
- 文字の色合いとかも当時のPC画面を意識してて、細かいところまでこだわってるのがすごい!
- でも、スマホで見るときにもうちょっとボタンを押しやすくするとか、より親切になるかな?って思ったよ🌸
昔のデザインをあえて使うっていうのは、今の感覚とミックスして新しい魅力を生み出す面白い方法だなあって改めて感じた✨
もし自分でポートフォリオ作るなら、こういう遊び心も取り入れてみたいなあ💭
ReactやTailwindに興味がある人は、こういう実例を見て「こういうのもできるんだ!」って刺激になるかも👀❣️
ちょっとレトロでかわいいウェブデザインの世界、覗いてみてほしいな〜って思ったよ💗
コメント
グレース
いい感じ! アバターのキャッシュ設定を変えてメモリに残すとレイアウトのズレが減るかも。
エイダン
めっちゃかっこいい! 似たの俺も作ってるよ: [https://os7311.vercel.app/](https://os7311.vercel.app/)
レオ
超スムーズ! ナイス仕事! 👍
ロバート
リンクは同じタブ派? 新しいタブ派? 俺は新タブ派で戻らなくて済むから楽だよ。 サイトもいい感じだね。
ベン
めっちゃ可愛い! すごく上手くできてる!
チャーリー
ウェブデスクトップ見たら即ポチ!
ハンナ
いいね! スタートボタンは文字だけじゃなくてボタン全体を押せるようにしたらもっといいよ。
リリー
記憶違いじゃなければ、これWin95っぽいよね? (昔だけど)
レオ
好き!
キンバリー
モバイルEdgeだとフォントがデフォルトのままだね。 Node.jsやJSのアイコンもピクセル調やWin98風にするといいかも。 とはいえ、すごく良くて使いやすいよ。 拍手!
クリス
今日見た中で一番良かった!
サラ
Safariのせいかもしれないけどフォントが読み込まれずAppleのデフォルト表示になってるよ。 iPhone14 ProのiOS26beta6で確認。
チャーリー
めっちゃ綺麗! おめでとう🙌
ロバート
いいね、それ俺もいつか作りたいと思ってたアイデアだ。