Rule 34 XYZ
Loading...

Goon-scrolling

July 23 by Sieghard

I was blushing the whole time I was making this video

Hey everyone. I've been waiting for this moment for a very long time. I finally get to show you a new way of interacting with the site. From here on I'll write "app" instead of "site", because in terms of how you interact with it, it's much closer to an app than a website.


DISCLAIMER

THIS IS A CLOSED PRE-ALPHA, the earliest stage there is (go easy on it)


goon scrolling test

test.rule34.xyz

test.rule34.xyz

test.rule34.xyz

You're the first to see this.

Keep in mind that this is a test build where I'm mainly testing the current state of the codebase. The test.rule34.xyz domain is used strictly for testing.

In other words, this is just a different UI for rule34.xyz, not a separate site with a separate database.

The mobile interface for the other sites will come much later, closer to release.


Mobile version

When I was building the first rule34 site more than 8 years ago, I focused on the desktop interface first, because according to Google Analytics most users were accessing the site from desktop. But time passed, and the balance kept shifting toward mobile.

Right now the user split looks like this:

  • 84% mobile
  • 12% desktop
  • 4% tablet

As you can see, mobile is way ahead. I spent a long time thinking about how to make one interface that works well on desktop and mobile at the same time. After a lot of research I realized it would be simpler to split them, since the two platforms are just too different. Better to have two separate interfaces than one universal one. This way I can play to the strengths of each platform separately.

This also means the desktop version will keep improving. Mouse interactions and other desktop-specific things will be added, and each UI/UX layout will adapt to its own target platform.

Look and feel

Once I committed to designing the app mobile-first, I started asking myself what it should actually be like. The Blazor version taught me a hard lesson. It's better to just study the market, find the players who are solving a similar problem, and take the solutions that work. I looked at who built mobile interfaces and how, down to the UI/UX details. Honestly, I took a lot of inspiration from the UI/UX of TikTok, YouTube Shorts and Instagram Reels.

The first and most important thing, the one that became the foundation of the mobile UI, is moving key navigation to the bottom of the screen, so you never have to reach for the top while holding your phone.

Second is the swipe. I don't think this one needs explaining. Everyone takes this gesture for granted.

Third is navigation. Side swipes should move you between different parts of the app.

Everything else is me compiling the best solutions from other players on the market.

The "back" button / gesture

Since I want the site to be controlled by gestures as much as possible, I also had to account for the back button/gesture. It works differently on different phones and platforms. On regular Android phones it's a plain back button that the browser picks up, on others it's a short swipe from the edge of the screen. Either way, pressing "back" to close a panel that slides out is easier than hunting for a close button. The problem is that on a website you can't just hijack "back" from the browser, because back means moving through browser history. So I have to invent all kinds of tricks to get around those limitations.

Now, while flipping through posts, you can close the viewer with "back". Panels close with "back" too, and dialogs will as well.

And one thing I want to show off. If you open a post, then open Details -> Suggested and open a post from there, you'll be scrolling that post's Suggested feed! You can nest this as deep as you like, and every "back" press takes you to the exact post you came from. I went way out of my way to make this work.

Customization

One of the important features will be tuning the app's UI to your liking. For example:

  • video playback settings (autoplay, auto-mute)
  • interface behavior, like how many video columns to show on wide screens
  • transparency and blur of the interface (adjustable per component)
  • themes (dark by default, light, and system)

All of this customization will be added gradually.

Three separate UIs

Here's the current situation in the project. There are three different UIs that all do the same job of giving you visual access to the site. Let's go through them.

  • app-main. The current version of rule34.xyz, written in Angular.
  • app-next. The mobile version I'm working on now, the one this post is about. Also written in Angular.
  • blazor. A version built a few years ago. Today it's rule34archive.com. Blazor turned out to be a poor fit. The technology has too many critical flaws, so I'm dropping it. The plan is to replace this version with app-next.

Magnum opus

I can safely say that the app I'm building now is my magnum opus. I'm pouring everything I know about frontend/UI/UX into it to show you my vision of what a Rule34 app like this should look and feel like. You could say I'm putting my soul into it. (I put my soul into all of my development work, but here a little more.)

What's next

This is only the beginning. The current build is just a demonstration of what's possible and where the UI/UX is heading. Every feature that already exists in app-main will make its way here over time.

In the near term, after the alpha, I'll switch to other tasks for a while. Then I'll work on playlists and subscriptions, plus the ability to pick a tag for search.

For app-next, the goal is a full release before the end of the year. After that I'll replace all the Blazor versions of the sites with it. At release, every site will show a banner inviting users to switch to the new version.

Depending on AI

goon-scrolling-2.jpg

For several months now I've been using Claude Code as an assistant on the project. It helps me with the routine work. But app-next is complex, especially the behavioral UI and all the hacks, so the codebase is hard to maintain and I find myself leaning on AI more and more. I think I've passed the point of no return. AI has massively raised the ceiling on the kind of project I can handle, but it also means I now depend on it. I just hope AI isn't going anywhere. I have faith it's the same story as the internet. It showed up and never left. So on one hand, yes, I feel the dependence. On the other hand, my productivity has grown a lot and I get far more done in the same amount of time.

Thanks for reading

I hope this wall of text was worth reading. Please try the new site and write in the comments below what you liked and what you didn't. Share your user experience, so to speak. I read every comment and your opinion really matters to me.

P.S. Feast your eyes on the icon app-next will be using for rule34.xyz

site-avatar.png

Comments

To comment you need to sign in or sign up
Or
Marceline3 days ago
The main site is down😭
Kuro [armpit expert]3 days ago
I like it here. In the first time and a long time i feel like a
slow10 days ago
I like the way it is now more. Please keep the current UI
peckpeck12 days ago
the new test interface is really nice 👏🏻
Static12 days ago
Idk how to send requests so I'm just gonna do it here, make one where we can see unwatched vids or unseen photos, please
Spys13 days ago
Hey there is bots spamming their own porn link
drathtribs14 days ago
FIRE
mrinkongito15 days ago
Can we add dislikes in this website
King15 days ago
yo opino que optimizar mejor la aplicacion o mejor, que podamos enviar imagenes de nuestros dispositivos y no solo de giphy
an1mexl15 days ago
More optimization
King Nasir17 days ago
Shokamai17 days ago
Just making my goon sessions better and better. This is the passion we like to see 🥹Ban birth-fetish and allow farting and this site will be even more peak!
Augustus Caesar19 days ago
This website shall be equivalent to Rome some day and I deem this site "Optimvs sitvs interretialis" or "The best website" (of course inspired by Trajan)
pazute7122 days ago
Gagamaru punch
Sieghard Jr23 days ago
Lets go papa
Evalynn Serrano23 days ago
Ts is wild ✌😭
walnut25 days ago
I was using this site fot a few years already but didnt saw this announcment page lol. Never was thinking that this was made by 1 person
hecking_boi25 days ago
LESS GOOO!!! 🔥
Full25 days ago
W
𝙼𝚒𝚢𝚊𝚋𝚒25 days ago
I ngl, the different UI is peak, I hope you can make this site getting better more than he already is. I really appreciate your work.
cosmicyujiro25 days ago
No sé si aquí puedo dar sugerencias o pedidos. Pero me gustaria que duplicaras los botones de desplazamiento, no se como explicarlo. Es decir, a la izquierda está detrás (siguiente publicación), a la derecha esta siguiente (anterior publicación), pero ¿podrías hacer que haya 2 botones en cada lado? A la izquierda, un botón de atrás y otro adelante, y en la derecha un botón de atrás y adelante.
John Ultrakill26 days ago
How the fuck do you [HYPERLINK BLOCKED] with [4% USER]
Hentai Adict26 days ago
omg peak
maxc2398326 days ago
This is a genius idea
Victoe27 days ago
How do anyone upload vid or photos here??
didy_foid27 days ago
can you like somehow add the video preview thing to mobile? when you hover on a video on desktop it just plays out
Adolf Hitler27 days ago
Goated
unkeldiddy28 days ago
Peak 🙌
Nishiniro28 days ago
That 4% is me btw
inflamebunnydemonsama28 days ago
Abligotry fuck you to AI. Like I get the feeling you think you have with AI, but I doubt it's actually productive and by the way you talk about it you seem more trapped by it than it actually helping you and not gonna lie that sounds bad. I'd say if you're having AI psychosis to try and have someone in your life reach out to you and stop using Claude, I guarantee your work flow would be about the same, it is just a crutch.