Shu präsentiert experimentelle Falt-Sidebar „shaduocn“

X-PostShuDemo

Shu (@shuding) hat ein interaktives Frontend-Experiment namens „shaduocn sidebar“ vorgestellt, bei dem sich eine Web-Seitenleiste wie ein Falt-Display umklappen lässt. Der Entwickler stellte klar, dass es sich um ein humorvolles Experiment mit bewusst unpraktischer UX handelt.

Das Wichtigste

  1. Interaktive Demo „Sidebar Duo“ auf Vercel demonstriert eine Seitenleiste mit Scharnier- und Faltanimation.
  2. Bietet Kontrollen für Scharnierwinkel (Hinge), Progressive Blur, Faltgrad in Prozent sowie einen Zeitlupenmodus.
  3. Die Oberfläche orientiert sich optisch an modernen Dashboards im shadcn-Stil.
  4. Auf Feedback zur Benutzerfreundlichkeit entgegnete Shu direkt, dass die UX schrecklich sei, er die Idee aber amüsant fand.

Warum das relevant ist

Das Projekt zeigt, wie sich physische Metaphern wie Scharniere und Falten mit CSS- und 3D-Transformationen im Browser umsetzen lassen, verdeutlicht jedoch auch die Grenze zwischen technischer Spielerei und praxistauglicher UI.

Einordnung

Mit der Wortschöpfung „shaduocn“ parodiert und kombiniert Shu Elemente aus modernen UI-Komponenten (shadcn) und Geräten mit Faltscharnier (Duo). Das Projekt ist technisch detailliert ausgearbeitet – inklusive progressivem Blur und manuellem Scrubbing des Scharniers –, versteht sich aber ausdrücklich als humorvolle Machbarkeitsstudie statt als produktionsreife Komponente.

Original-Post

Shu

@shuding · 23. Oktober 2026

shaduocn sidebar: t.co/ZDL6LjeqJ1 t.co/fT29l5GetM

908 Likes37 Antworten372 Lesezeichen51.748 Aufrufe

Auf X ansehen
Weitere Posts im Thread (2)
  1. @clcombe Yeah it’s terrible UX, I just found the idea funny :)
  2. @zaochih Fixed!
Ausgewählte Antworten (5)
  • @object_nullll @shuding 在安卓 chrome 上看起来就像是碎屏的 iPhone duo t.co/PPzRLPHbF3
  • @imarikchakma @shuding I like the name shad-duo-cn :D
  • @vishalanton_ @shuding ASMR
  • @clcombe @shuding I don't understand why anyone would benefit from this - technically but slow and annoying if you have to toggle and use things. What's the UX outcome here?
  • @light_laughs @shuding It's falling apart on mobile....

Links und Tools aus diesem Beitrag

Zusammenfassung von KI erstellt (Gemini 3.8 Flash, 27. Oktober 2026). Sie kann Fehler enthalten – maßgeblich ist die Originalquelle.

Inhaltlich ähnlich, ermittelt über die KI-Suche.

  • Link:shaduocn.vercel.app

    Interaktive Demo für faltbare Seitenleiste: Fold Lab

    Die Webanwendung demonstriert eine faltbare Seitenleiste mit progressivem Unschärfeeffekt (Blur) in einem Dashboard-Kontext. Die Oberfläche bietet Kontrollmöglichkeiten für Scharnierwinkel, Unschärfe und Faltung sowie eine Übersicht über Deployments und Leistungsmetriken.

    Webentwicklung· Demo

  • X-Post:Harshit

    Open-Source-Branding-Lab kombiniert Shader mit Marken-Assets

    Entwickler Harshit stellt ein Nebenprojekt vor, das sich zu einem Werkzeug für Branding-Experimente entwickelt hat. Das Tool kombiniert Shader mit Branding-Assets und ist Teil eines Open-Source-Projekts.

    571Lesezeichen21.055Aufrufe

    Webentwicklung· Tool

  • X-Post:Shadcn Labs

    pdfcn: Gestaltbare PDF-Komponenten für shadcn/ui

    Shadcn Labs verweist auf pdfcn, eine Komponentenbibliothek zur Erstellung von gestaltbaren, barrierefreien PDF-Dokumenten. Die Bibliothek basiert auf Takumi sowie Forme und ist auf die Verwendung mit shadcn/ui ausgelegt.

    935Lesezeichen109.449Aufrufe

    Webentwicklung· Tool

  • X-Post:Details

    Parallax-Karussell mit Keen Slider für interaktive Frontend-Präsentationen

    Details (@details_so) stellt eine responsive Karussell-Komponente mit sanftem Bild-Parallax-Effekt vor, die auf Keen Slider basiert. Der zugehörige Code sowie ein Prompt zur AI-gestützten Einrichtung werden über die Plattform Vault bereitgestellt.

    22Lesezeichen1554Aufrufe

    Webentwicklung· Sammlung

  • X-Post:Aniket Pawar

    Ankündigung von Shadcn Labs: Primitive für das KI-Zeitalter

    Aniket Pawar hat das Projekt Shadcn Labs angekündigt, das neue Basis-Bausteine für Softwareentwickler im Zeitalter künstlicher Intelligenz bereitstellen soll. Das Vorhaben knüpft namentlich an das bekannte UI-Ökosystem an und nennt Werkzeuge wie termcn, agentcn und mcpcn.

    173Lesezeichen21.061Aufrufe

    KI & AI· Ankündigung

Sprechen wir über Ihr Projekt.

Standorte

  • Mattersburg
    Johann Nepomuk Bergerstraße 7/2/14
    7210 Mattersburg, Austria
  • Wien
    Ungargasse 64-66/3/404
    1030 Wien, Austria

Ein Teil von diesem Inhalt wurde mit KI gemacht.