Topic: New e621 interface

Posted under General

I am genuinely hoping this is like last year’s April Fool’s joke (where all text became UWU-ified) where they just turned it on a week early, because the colors are actually hurting my eyes and giving me a headache.

Edit: Okay, that is much better. Now I can use this website’s mobile version without having to take a break every two minutes.

Updated

Yes, the mobile interface wasn't ideal at all - easy to mistap. Could have been solved by spacing out the +/-/? buttons on phone wider. The badges themselves might be more intuitive for new users, they're not too outrageous, maybe just too bright. Removing the buttons and shoving the badges into a flexbox so that they're not, you know, a neatly aligned navigable alphabetical column on the other hand - what the hell?
If we're adding modern UI elements, why not a floating scroll to top/bottom button when scrolling past a huge comment section? That's something that would improve the mobile experience (I know there's the skip to sections links, won't do you good when you're in the middle of a huge section though).
Maybe (armchair hypothesising here) the reasoning behind the flexbox was to compress the tag section so it's not too long, especially if it's more spread out for easier phone use - but considering only the edit tools and footer follow the tag section, that's not really a concern.
On the topic of bitching about stuff, ever since the rework some years ago, the tag search page defaults to ordering by newest tags rather than post count, with the search box and options collapsed. For most regular people's use cases, that's just something they have to always change now.

Updated

I'm sorry but the new interface for the tags hurts my eyes and takes up way too much space imo.

helloanonmyoldfriend said:
Yes, the mobile interface wasn't ideal at all - easy to mistap. Could have been solved by spacing out the +/-/? buttons on phone wider. The badges themselves might be more intuitive for new users, they're not too outrageous, maybe just too bright. Removing the buttons and shoving the badges into a flexbox so that they're not, you know, a neatly aligned navigable alphabetical column on the other hand - what the hell?
If we're adding modern UI elements, why not a floating scroll to top/bottom button when scrolling past a huge comment section? That's something that would improve the mobile experience (I know there's the skip to sections links, won't do you good when you're in the middle of a huge section though).
Maybe (armchair hypothesising here) the reasoning behind the flexbox was to compress the tag section so it's not too long, especially if it's more spread out for easier phone use - but considering only the edit tools and footer follow the tag section, that's not really a concern.
On the topic of bitching about stuff, ever since the rework some years ago, the tag search page defaults to ordering by last changed tags rather than post count. For most regular people's use cases, that's just something they have to always change now.

actually, it does seem like if you just force the desktop look after this update, the buttons are separated and more clickable already compared to how they looked previously (although that might also be slightly influenced by other CSS changes I've made previously). honestly, just like this looks good enough to me.

thisorthat said:
I am genuinely hoping this is like last year’s April Fool’s joke (where all text became UWU-ified) where they just turned it on a week early, because the colors are actually hurting my eyes and giving me a headache.

bladeedge said:
I'm sorry but the new interface for the tags hurts my eyes and takes up way too much space imo.

check my user about
(I'm just gonna dmail people after this, don't wanna spam)

sloppyheadwind said:
My tags all still look normal?? Or is this still preview-site only?

the change is (mostly) mobile only.
(desktop got a button to add tags to the blacklist, and the verification icon is hexxier, everything else is mostly unchanged.)

dba_afish said:
the change is (mostly) mobile only.
(desktop got a button to add tags to the blacklist, and the verification icon is hexxier, everything else is mostly unchanged.)

Ahhh, okay.

SCTH

Member

Well the +/-/? buttons were just re-added to mobile view, with larger touch targets more suitable for mobile use.

scth said:
Well the +/-/? buttons were just re-added to mobile view, with larger touch targets more suitable for mobile use.

Seconding this on my end
Also the tags are a vertical list again instead of clumped (which in all honesty I didn't mind lol)

Temp7

Member

Much better now. Still missing the (+) button but that's a lot better than the garish nonsense from awhile ago.

SCTH

Member

temp7 said:
Much better now. Still missing the (+) button but that's a lot better than the garish nonsense from awhile ago.

It's not missing the +/- buttons anymore, it's just that they only show up when you have a search. They aren't useful when there's no search anyway, since just clicking a tag normally goes to a search with that tag.

battle_fennec said:
So the new UI doesn't show tags for me on posts I click. What's going on?

Same, My tag list is missing now?

Edit: There some fullscreen button in the top right. It somehow was enabled when I logged in today. Disabling it reveals the tags.

Updated

deathy said:
Same, My tag list is missing now?

Edit: There some fullscreen button in the top right. It somehow was enabled when I logged in today. Disabling it reveals the tags.

Where is that? I can't find it
Edit
Ah it's not visible from a post, only in the index page, nvm

Updated

Yep. Can confirm the update to the update is far better on mobile. This actually looks like an improvement over the old look now.

Lzhom

Member

Is there a way to keep fullscreen mode on search page and normal mode on posts?

Not a fan of the big box that shows the tag description when searching a single tag. Yeah, I'm looking for boobies. No, I don't need you to tell me what those are every time.

Also, I guess today (?) another UI update was pushed that adds boxes around each entry in the tag lists? Hate that, now the tag lists are a quarter mile long on mobile.

dicklemcpickle said:
Not a fan of the big box that shows the tag description when searching a single tag. Yeah, I'm looking for boobies. No, I don't need you to tell me what those are every time.

there's been an x on that box that disables it. it's been there almost as long as the box has existed.

My opinions of the new updated layout:

I like the new hide option on the tags when searching and in the posts (very helpful for when doing tag clean-ups too).

I dislike that the tags don't show up in the posts if you hide them in the search now (there should be two different options so we can toggle any as we wish).

I dislike that we can't easily select tags anymore (before we just positioned the cursor to the side of the tag, click and drag (good to copy-paste complicated names and multiple names), now we can't do that anymore without also copying the ?+- symbols or the numbers).

romanicyte2 said:
I dislike that we can't easily select tags anymore (before we just positioned the cursor to the side of the tag, click and drag (good to copy-paste complicated names and multiple names), now we can't do that anymore without also copying the ?+- symbols or the numbers).

   
ʚ(ϵ⁰⏑⁰)

on mobile it's now entirely impossible from what I can tell, since long tapping is both "right-click" and "click and drag" and right-click takes priority. now the best way to copy the tag name as far as I can tell is just copying the url of the link and then cleaning it after pasting or maybe opening the tag's search in a new window and pulling it from the search box.

is there a way to bring the old tags UI from mobile? I honestly hated the new one, it's confusing and unpractical

I actually enjoy (or remain neutral) on 99% of the UI updates. However, when I checked e6 today on my phone and noticed the tags-list UI change, I about barfed. They have a ridiculous amount of unnecessary padding; they are now more like buttons and modules that take up 2x the amount of height on the page (completely unnecessary) rather than list items that are accessible and clickable. They just... aren't great. It seems whoever made that UI choice is trying to fix a problem that didn't exist, and/or was just trying to "modernize" it for the sake of modernizing it (which they accomplished) but in doing so, made it not flow how the end user would expect it to flow.

I hope e6 takes this criticism and maybe makes the changes. If E6 devs want some ideas to revolutionize the tags in a way that would make sense, I could probably whip up a few designs and send them (for free, because I genuinely care about this site)

SCTH

Member

ares_the_great said:
I actually enjoy (or remain neutral) on 99% of the UI updates. However, when I checked e6 today on my phone and noticed the tags-list UI change, I about barfed. They have a ridiculous amount of unnecessary padding; they are now more like buttons and modules that take up 2x the amount of height on the page (completely unnecessary) rather than list items that are accessible and clickable. They just... aren't great. It seems whoever made that UI choice is trying to fix a problem that didn't exist, and/or was just trying to "modernize" it for the sake of modernizing it (which they accomplished) but in doing so, made it not flow how the end user would expect it to flow.

I hope e6 takes this criticism and maybe makes the changes. If E6 devs want some ideas to revolutionize the tags in a way that would make sense, I could probably whip up a few designs and send them (for free, because I genuinely care about this site)

If you know how to do actual web design, you could always send a pull request to the e621ng Github repo. There are lots of considerations though, like the old design's tags being tricky to reliably click on mobile devices.

is there a way to make tags with just 1 post go back to having a red number? it's really hard to remove bad tags when i can't see them easily on the tag list while editing.

confirmed bug :)

Updated

At least for mine, the glaring tag backgrounds have been fixed, and the tags are now in vertical arrangement again. It's still missing the add or remove from search function, but I am admittedly happy with the return to something cohesive.

I, however, don't really see what this change added, and in fact think it's still removed functionality overall.

SCTH

Member

sinicalsix said:
At least for mine, the glaring tag backgrounds have been fixed, and the tags are now in vertical arrangement again. It's still missing the add or remove from search function, but I am admittedly happy with the return to something cohesive.

I, however, don't really see what this change added, and in fact think it's still removed functionality overall.

Add/remove from search still exists, just not when you don't have a search - they're useless in that case anyway.

Watsit

Privileged

scth said:
Add/remove from search still exists, just not when you don't have a search - they're useless in that case anyway.

That's how it's been on desktop since they were originally added. FWIW. The +/- buttons don't show when there's no search, but do where there is. To be honest, I wish there was an option to always hide them even when there is a search since I never use them and they take up precious space in the tag list, causing more tags to word wrap than necessary.

ares_the_great said:
I actually enjoy (or remain neutral) on 99% of the UI updates. However, when I checked e6 today on my phone and noticed the tags-list UI change, I about barfed. They have a ridiculous amount of unnecessary padding; they are now more like buttons and modules that take up 2x the amount of height on the page (completely unnecessary) rather than list items that are accessible and clickable. They just... aren't great. It seems whoever made that UI choice is trying to fix a problem that didn't exist, and/or was just trying to "modernize" it for the sake of modernizing it (which they accomplished) but in doing so, made it not flow how the end user would expect it to flow.

I hope e6 takes this criticism and maybe makes the changes. If E6 devs want some ideas to revolutionize the tags in a way that would make sense, I could probably whip up a few designs and send them (for free, because I genuinely care about this site)

from my experience, padding is _never_ unnecessary on clickable elements on mobile. every button should preferably have around 66-100% of a full thumb-width between its center and the edge of the next closest element. the amount of padding betwen buttons the site currently has is totally within reasonable levels.

also, put elements with hyper links should absolutely never touch the left or right side of the lower third of the screen.

I totally agree with what Cinder is trying to do to improve the mobile UI (even if I don't agree with his visual design sensibilities all the time). I think the way we have the tag list right now on mobile (after the fix update that happened around 22 UTC) looks pretty good.

watsit said:
I wish there was an option to always hide them even when there is a search since I never use them and they take up precious space in the tag list, causing more tags to word wrap than necessary.

.tag-list-inc { display: none; }

dba_afish said:
from my experience, padding is _never_ unnecessary on clickable elements on mobile. every button should preferably have around 66-100% of a full thumb-width between its center and the edge of the next closest element. the amount of padding betwen buttons the site currently has is totally within reasonable levels.

also, put elements with hyper links should absolutely never touch the left or right side of the lower third of the screen.

I totally agree with what Cinder is trying to do to improve the mobile UI (even if I don't agree with his visual design sensibilities all the time). I think the way we have the tag list right now on mobile (after the fix update that happened around 22 UTC) looks pretty good.

.tag-list-inc { display: none; }

Going to hard disagree. While I do agree that there should be padding between them, there is a ridiculous amount of it on the new buttons (vertically, the inline padding is fine and has nothing to do with what I'm talking about). By the way, we're talking about the NEW (recently released, just noticed it today) mobile ones, with the borders on them, not what the site has had for a good amount of time already. You could easily cut the amount of padding between each tag button/item by 75% and it'd still be plenty of padding on mobile. In fact, it was technically fine before.

dba_afish said:
from my experience, padding is _never_ unnecessary on clickable elements on mobile. every button should preferably have around 66-100% of a full thumb-width between its center and the edge of the next closest element. the amount of padding betwen buttons the site currently has is totally within reasonable levels.

also, put elements with hyper links should absolutely never touch the left or right side of the lower third of the screen.

I totally agree with what Cinder is trying to do to improve the mobile UI (even if I don't agree with his visual design sensibilities all the time). I think the way we have the tag list right now on mobile (after the fix update that happened around 22 UTC) looks pretty good.

.tag-list-inc { display: none; }

BTW, I just went into dev tools and changed the gap style (which is what's actually the problem, not padding) from .5rem .25rem to 2px and removed the borders again (they really break up the flow of the page) and it honestly looks so much better. Still plenty of gap between the list items, but not a needless amount.

scth said:
If you know how to do actual web design, you could always send a pull request to the e621ng Github repo. There are lots of considerations though, like the old design's tags being tricky to reliably click on mobile devices.

I do, yet I've never heard of it being an issue. Your comment makes it out as if there have been issues with it.

manitka said:
is there a way to make tags with just 1 post go back to having a red number? it's really hard to remove bad tags when i can't see them easily on the tag list while editing.

confirmed bug :)

also, yes: .low-post-count { color: red; }

dba_afish said:
also, yes: .low-post-count { color: red; }

yep cinder already gave it to me on the discord, but thank you :D

Furries arent actually real, tags dont need to take up half the phone screen for paws.

Can someone please tell me what I need to change in the custom css to get rid of the tag borders and excessive padding on mobile? It's incredibly ugly and not really conductive to efficiently finding specific tags on a post, especially on posts with a large number of tags.

collarslut said:
Can someone please tell me what I need to change in the custom css to get rid of the tag borders and excessive padding on mobile? It's incredibly ugly and not really conductive to efficiently finding specific tags on a post, especially on posts with a large number of tags.

.tag-list-item { border: none; }
.tag-list { gap: 0; }

dba_afish said:
there's been an x on that box that disables it. it's been there almost as long as the box has existed.

It disables it only for that session. It returns every time you relog.

hal_greaves said:
A reminder that feedback really does need to go here: https://coda.io/form/Share-Your-Feedback_dU9JQnoELGI

Otherwise we are very likely going to miss it.

Thank you.

Oh did not know that we had an actual feedback form for this, though was it only shared on the discord that a tiny minority who uses this place is on or did I miss a previous post? Glad to see it on the official website if so :)

My one question to this though is that if a majority actually is able to find this form and asks for a revert or way to use the better previous version of the site still, what will you guys do? Listen to feedback or just ignore it?

Watsit

Privileged

casmin7~ said:
Oh did not know that we had an actual feedback form for this, though was it only shared on the discord that a tiny minority who uses this place is on or did I miss a previous post?

It was mentioned in some past threads talking about the changes, as well as the changelog post. I can see it being easy to miss if you don't regularly check the forums, but it had been mentioned previously.

Finally realized that the + and - are gone, but only after I click on a post. Can't narrow down what I want. Should be a setting if it's going to just be a thing, clearing the searchbar when you look at an image I mean.

The new update is much nicer (way less harsh on the eyes).
Also, is it just me or did the font size of everything below the tag list on posts shrink compared to before on mobile?

carbohybrid said:
The new update is much nicer (way less harsh on the eyes).
Also, is it just me or did the font size of everything below the tag list on posts shrink compared to before on mobile?

I noticed that too, but it might be due to the tags being bigger. I do hope it's made a bit bigger because it's tiny on my phone screen.

I DO enjoy the tags being bigger and better delimited though, it's been mentioned a few times already in the replies, but it is pretty common for me to touch a specific tag I want to search for, just for Firefox to decide that I clicked the tag above or below instead, so I had to go back and try again (maybe after zooming in a bit)

colaymorak said:
And why did you break the functionality in the tag list in the favorites section too?

themimic said:
Currently your favorites doesn't have +- for tagging, and the favorite hotkey is busted. Pressing it does not favorite the post.

There are two ways of viewing Favorites. Only one of the two methods seems to be treated as a search, and has the +- links available:

  • If you go to your user page, click "Favorites", it takes you to a URL that ends in the format "favorites?user_id=12345678". Even though the search box is pre-filled with "fav:yourusername", this method is not treated like a normal search. The +- links do not appear, favorites are arranged in order of how recently you added them, and there's a warning message: "Searching favorites does not preserve the order in which they were added."
  • If you type "fav:yourusername" into the search box, that one is treated like a normal search: it uses a URL that ends in "posts?tags=fav%3Ayourusername", has the +- links available, and arranges the posts by upload date (the default order for searches).

Before the new update, did both methods display the +- links next to each tag? I honestly can't remember!

romanicyte2 said:
I dislike that we can't easily select tags anymore (before we just positioned the cursor to the side of the tag, click and drag (good to copy-paste complicated names and multiple names), now we can't do that anymore without also copying the ?+- symbols or the numbers).

Yes, this is the issue for me. When I want to save an e621 image to my PC, if there's a source available, I follow that link and save from the original source (because places like DA and FA usually include the uploader's name in the original filename). But if there's no source, or the source is somewhere that I don't have an account, I save the image from e6, and copy the artist's name so I can paste it into the the filename.

Before, I could copy the artist's name by putting my cursor between the the tag name and the post count, and clicking and dragging from right to left. But the new tag layout means that if you click and drag from the right, you have to include the post count in the copied selection. So this means that I have to do a bit more editing of the filename, after I paste it in.

It's only mildly inconvenient, but it is a change for the worse!

How do people think this is good? On PC there just isn't tags, I click on an image and who drew it? Your guess is as good as mine! Who is the character? I don't know!

theonedoom said:
How do people think this is good? On PC there just isn't tags, I click on an image and who drew it? Your guess is as good as mine! Who is the character? I don't know!

this is caused by being in full-screen.

you can unhide the sidebar with this:

@media (min-width: 50rem) {
body[data-st-fullscreen="true"] .post-index .sidebar { display: flex; grid-area: unset; }
}

but it'll be under everything else rather than on the side.

dba_afish said:
check my user about
(I'm just gonna dmail people after this, don't wanna spam)

Hey uhhh one minor problem (for mobile users)
The about me height has a maximum limit
You've hidden everything in quotes so it doesn't show "show more", but that means when expanded it's not there and everything below that line is not shown

dba_afish said:
great, two of most vocal mobile users can't even use the feedback forms.

nvm it decided to start functioning

Updated

snpthecat said:
Hey uhhh one minor problem (for mobile users)
The about me height has a maximum limit
You've hidden everything in quotes so it doesn't show "show more", but that means when expanded it's not there and everything below that line is not shown

weird, the "show more" had always shown up before just a bit ago, might've been some change I made within the last half a day or so that caused it to act weird.
I just added a bunch of filler lines to expand it out.

dba_afish said:

.tag-list-item { border: none; }
.tag-list { gap: 0; }

Thank you for the blessed fix to this awful ui change.

mta_2_train said:
I liked it, it would be cool if there was a option for the classic theme

This i hate it when companies change a ui without leaving an option for it to be toggeld. I use on mobile and its a pain to use on a small screen

I'm..not a huge fan on the changes
Mainly because I use it on my phone, vertical, it shows a pool if there is a pool, the next image if it has a parent picture or other, and all the tags and sources,
If I turn my phone horizontal
ALL THAT GOES AWAY
And I'm usually horizontal because bigger image

irithryil said:
I'm..not a huge fan on the changes
Mainly because I use it on my phone, vertical, it shows a pool if there is a pool, the next image if it has a parent picture or other, and all the tags and sources,
If I turn my phone horizontal
ALL THAT GOES AWAY
And I'm usually horizontal because bigger image

this is caused by full-screen mode, which hides the sidebar entirely.
paste this in user CSS if you want it to show up at the bottom of the page like it does on mobile:

@media (min-width: 50rem) {
body[data-st-fullscreen="true"] .post-index .sidebar { display: flex; grid-area: unset; }
}

dba_afish said:
this is caused by being in full-screen.

you can unhide the sidebar with this:

@media (min-width: 50rem) {
body[data-st-fullscreen="true"] .post-index .sidebar { display: flex; grid-area: unset; }
}

but it'll be under everything else rather than on the side.

dba_afish said:
this is caused by full-screen mode, which hides the sidebar entirely.
paste this in user CSS if you want it to show up at the bottom of the page like it does on mobile:

@media (min-width: 50rem) {
body[data-st-fullscreen="true"] .post-index .sidebar { display: flex; grid-area: unset; }
}

Please, do me and everyone else a favor and stop with this nonsense.
If you want to help, the correct answer to this question is to tell them that they turned the fullscreen mode on, and to instruct them to turn it off from the search page.
A fix for the fullscreen button not showing up on the posts#show page is already made, and will be deployed in the next patch.

If you want to give people an option to show tags on the posts#show page even in fullscreen mode, that's fine.
But presenting it to them as the solution here is just plain wrong.

cinder said:
Please, do me and everyone else a favor and stop with this nonsense.
If you want to help, the correct answer to this question is to tell them that they turned the fullscreen mode on, and to instruct them to turn it off from the search page.
A fix for the fullscreen button not showing up on the posts#show page is already made, and will be deployed in the next patch.

If you want to give people an option to show tags on the posts#show page even in fullscreen mode, that's fine.
But presenting it to them as the solution here is just plain wrong.

I didn't think my wording was presenting it as the only solution, I did make it clear that it was something that resulted from being in full-screen mode, so I thought that toggling it off being an option was presumed. while I did kinda assume that they'd want to keep using full screen, I did say "can" or "if" both times.

Hey, did the update mess up image sizing on mobile? Before the update post #5450433 displayed perfectly fine on my vertical screen. But after the update, I now have to scroll to the side to see the entire thing.

titanusoptronix said:
Hey, did the update mess up image sizing on mobile? Before the update post #5450433 displayed perfectly fine on my vertical screen. But after the update, I now have to scroll to the side to see the entire thing.

is your view mode set to either Fit (Horizontal) or Sample (850px)?

dba_afish said:
is your view mode set to either Fit (Horizontal) or Sample (850px)?

Neither work for me. Are they normal for anyone else on mobile?

titanusoptronix said:
Neither work for me. Are they normal for anyone else on mobile?

it looks fine for me, but I also have a mountain of CSS changes that would effect stuff like this.

does this happen on all images or just some of them? is there anything else on these pages that might be causing the page to expand horizontally?

edit: also, does it happen on stuff on e926.net?

Updated

dba_afish said:
it looks fine for me, but I also have a mountain of CSS changes that would effect stuff like this.

does this happen on all images or just some of them? is there anything else on these pages that might be causing the page to expand horizontally?

edit: also, does it happen on stuff on e926.net?

I think i figured it out. When I collapse the description, it goes back to normal. Also no, it doesn’t happen to all images.

Edit: it does happen on e926

titanusoptronix said:
I think i figured it out. When I collapse the description, it goes back to normal. Also no, it doesn’t happen to all images.

Edit: it does happen on e926

ahh, now I see it, it seems like Chrome does its damnedest to not have URLs break at the end of a line (or something like that). this means that it just caused the containing element (in this case, the description and its containers) to stretch to fit.

I think this should aliviate the problem:

.dtext-link { word-break: break-word; }

dba_afish said:
ahh, now I see it, it seems like Chrome does its damnedest to not have URLs break at the end of a line (or something like that). this means that it just caused the containing element (in this case, the description and its containers) to stretch to fit.

I think this should aliviate the problem:

.dtext-link { word-break: break-word; }

Didn’t work. I should mention I’m using Safari.

titanusoptronix said:
Didn’t work. I should mention I’m using Safari.

uhh... try word-break: break-all; instead?

also, even if that dosn't work, #post-description-container { max-width: 98vw; } should stop the description box from stretching out. the text will just overflow the box instead, which should stop it from messing with other elements.

not super sure why this is a problem all of a sudden, either, I don't think any of this stuff has changed recently...

Updated

snpthecat said:
It literally says API Key (Generate) on your profile.

I have since found this, idk if it wasn't there day one or if I really did miss that.

katesweaty said:
I have since found this, idk if it wasn't there day one or if I really did miss that.

It should be in your user settings, not on the profile page.

dba_afish said:
uhh... try word-break: break-all; instead?

also, even if that dosn't work, #post-description-container { max-width: 98vw; } should stop the description box from stretching out. the text will just overflow the box instead, which should stop it from messing with other elements.

not super sure why this is a problem all of a sudden, either, I don't think any of this stuff has changed recently...

The first thing didn’t work either.

It’s weird, the image like gets bigger when the desc opens. But returns to normal when I close the desc.

titanusoptronix said:
The first thing didn’t work either.

It’s weird, the image like gets bigger when the desc opens. But returns to normal when I close the desc.

this happens because its element is sized relative to its parent element. so, if there's something that forces that parent element to expand past what's expected, the image and a bunch of other elements will try to do the same.

There's a bug where if you're scrolling through a search by clicking the "next/previous" buttons on the image pages, you can't open the "Add To Sets" button unless you refresh