Skip to content

Latest commit

 

History

History
223 lines (112 loc) · 9.53 KB

README.md

File metadata and controls

223 lines (112 loc) · 9.53 KB

😵‍💫🌀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.

ChaosWeb

🚀 What is ChaosWeb?

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
GitHub stars forks issues pull requests Closed PRs Languages Contributors

🤯 Example Features of the Chaos:

ChaosWeb
  • 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

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

ChaosWeb is proudly part of global initiatives engaging with passionate developers and open-source enthusiasts worldwide:

Name Logo Purpose
GSSoC'2024-Extd GirlScriptSummerOfCode The coding period is from October 1st to October 30th, during which contributors make contributions and earn points on the platform.
Hacktoberfest 2024 Hacktoberfest 2024 Hacktoberfest is a month-long October event welcoming all skill levels to join the open source community

✨ Project Structure

Check the project structure here Project Structure and choose where to start with spreading chaos.

💥Live Preview:

Chaos web🚀

🛠️ Tech Stack

ChaosWeb
  • 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

ChaosWeb

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

ChaosWeb
  1. Clone the Repository:

    git clone https://github.com/YourUsername/ChaosWeb.git
  2. Navigate to the project directory:

    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

ChaosWeb
  • 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

ChaosWeb

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 Create pull request: new pull request

❓ Have Doubts

ChaosWeb

🙋‍♂️Raise discussion here: raise a discussion

🔥 Why Build This?

ChaosWeb

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.

Contributors

ChaosWeb

Thank you for contributing to our project! Your help is greatly appreciated in making BasicNative even better. 😊

-----------------------------------------------------

Stargazers

Stargazers repo roster for @vansh-codes/ChaosWeb

Forkers

Forkers repo roster for @vansh-codes/ChaosWeb

-----------------------------------------------------