https://github.com/vansh-codes/chaosweb
Everything is chaotic here!!
https://github.com/vansh-codes/chaosweb
chaosweb gssoc24 gssoc24extd hacktoberfest hacktoberfest-accepted swoc swoc-25 ui-experiment
Last synced: 5 months ago
JSON representation
Everything is chaotic here!!
- Host: GitHub
- URL: https://github.com/vansh-codes/chaosweb
- Owner: vansh-codes
- License: mit
- Created: 2024-09-27T18:49:04.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2025-01-09T18:07:43.000Z (over 1 year ago)
- Last Synced: 2025-10-09T07:14:00.701Z (10 months ago)
- Topics: chaosweb, gssoc24, gssoc24extd, hacktoberfest, hacktoberfest-accepted, swoc, swoc-25, ui-experiment
- Language: JavaScript
- Homepage: https://chaosweb.vercel.app/
- Size: 34.9 MB
- Stars: 24
- Watchers: 1
- Forks: 72
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Security: SECURITY.md
Awesome Lists containing this project
README
# 😵💫🌀ChaosWeb: The Disorderly UI Experiment
Welcome to **ChaosWeb** — a web design experiment where nothing behaves as it should, and everything is delightfully out of order! If you’re tired of the conventional and predictable nature of websites, **ChaosWeb** offers a creative break from the norm with unpredictable navigation, bizarre sliders, and a world where scrolling defies gravity.
## 🚀 What is ChaosWeb?
**ChaosWeb** is a quirky and deliberately chaotic HTML, CSS, and JavaScript website project designed to challenge the norms of web design. It’s a place where everything is intentionally messy and unpredictable. The goal isn’t usability, but rather to create an anti-UI experience that’s confusing, frustrating, yet strangely fun to explore.
## 📈 GitHub Repository Stats
| 🌟 **Stars** | 🍴 **Forks** | 🐛 **Issues** | 🔔 **Open PRs** | 🔕 **Closed PRs** | 🛠️ **Languages** | ✅ **Contributors** |
| ------------------------------------------------------------------------- | ------------------------------------------------------------------ | --------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------- |
|  |  |  |  |  |  |  |
## 🤯 Example Features of the Chaos:
- **Unreliable Navbar:** Click on a menu item, and watch as a completely unrelated dropdown opens up.
- **Reverse Scrolling:** Scroll vertically to see horizontal movement, and horizontally to scroll vertically. Nothing is as it seems!
- **Slider Madness:** Navigate through the website using a custom-built slider instead of the standard browser scrollbar.
- **Displaced Clicks:** Random elements react to your clicks, but not the ones you expect.
- **Distorted UI Elements:** Watch buttons, dropdowns, and sliders randomly change positions and behavior.
- **Wierd Animations**: Animations that are sick to watch.
- **Misleading Animations:** Hover effects and animations that lead your cursor astray.
- **Hidden Secrets:** Easter eggs of disorder await the most curious adventurers.
## 🤹♂️ The Experience
ChaosWeb is not about smooth navigation or polished interfaces. It’s about creating a chaotic user journey full of surprises, designed to subvert your expectations. Users will find themselves laughing, confused, and maybe even a bit annoyed, as they explore the mess.
## 💪 Outreach
ChaosWeb is proudly part of global initiatives engaging with passionate developers and open-source enthusiasts worldwide:
Name
Logo
Purpose
GSSoC'2024-Extd
The coding period is from October 1st to October 30th, during which contributors make contributions and earn points on the platform.
Hacktoberfest 2024
Hacktoberfest is a month-long October event welcoming all skill levels to join the open source community
SWOC 2024
Social Winter of Code introduces participants to open source through projects, mentorship, and workshops on development, AI, Web3, and more.
## ✨ Project Structure
Check the project structure here [Project Structure](PROJECT_STRUCTURE.md) and choose where to start with spreading chaos.
## 💥Live Preview:
**[Chaos web🚀](https://chaosweb.vercel.app/)**
## 🛠️ Tech Stack
- **REACT**: Use React for Chaos
- **HTML**: The foundation of the chaos.
- **CSS**: Styles that never behave as you’d expect.
- **JavaScript**: Bringing the madness to life with unpredictable interactions.
## 🎯 Purpose
This project serves as an exploration of **anti-user experience (anti-UX)** and the deliberate breakage of web design rules. It's a playground for developers to experiment with unusual UI/UX patterns, break away from the ordinary, and perhaps learn something new by going against the grain.
## 🧪 How to Install & Run
1. **Clone the Repository**:
```bash
git clone https://github.com/YourUsername/ChaosWeb.git
```
2. **Navigate to the project directory**:
```bash
cd ChaosWeb
cd chaosweb-v@2
```
3. **Open in Browser**:
Run `npm run dev` in your preferred web browser and enjoy the chaos!
## 🚧 Future Features
- **Randomized Element Movement**: Elements that float, drift, and change positions as you scroll.
- **Inverted Controls**: Buttons that do the opposite of what you think they will.
- **Mystery Popups**: Popups that appear and disappear at random, leaving users puzzled.
- **More Easter Eggs**: Add hidden interactions that will reward curious users.
## 🤝 Contributing
If you have ideas to make ChaosWeb even more chaotic, feel free to cerate an issue, fork the repo and submit a pull request! Let’s make the internet messy together.
Create issue: [new issue](https://github.com/vansh-codes/ChaosWeb/issues/new/choose)
Create pull request: [new pull request](https://github.com/vansh-codes/ChaosWeb/compare)
## ❓ Have Doubts
### 🙋♂️Raise discussion here: [raise a discussion](https://github.com/vansh-codes/ChaosWeb/discussions)
## 🔥 Why Build This?
Because sometimes, breaking the rules is fun. **ChaosWeb** is a way to shake off the constraints of traditional web design and embrace the joy of unpredictability. If you’re a developer looking to play around with unconventional ideas, this is the perfect sandbox for you.
**Have fun exploring the chaos of the web!**
Show some ❤️ by ⭐ the repository!
### 📜License
This project is licensed under the [MIT LICENSE](./LICENSE).
Contributors
Thank you for contributing to our project! Your help is greatly appreciated in making BasicNative even better. 😊
## Stargazers
[](https://github.com/vansh-codes/ChaosWeb/stargazers)
## Forkers
[](https://github.com/vansh-codes/ChaosWeb/network/members)
