Future UI/UX

changed the description

regarding the sketch:

looks like customization is severely reduced, using a background image no longer a possibility with such layout, which IMO is a major loss. You could adjust the color scheme overall but this is boring
whitespace. shitton of it. Makes it look like it was made for tablets or something, computer users won't be impressed with it to say the least.
posts heights. Avatar above post with handle adds a lot to post height, combined with whitespace above. Given that a lot of posts on fedi are shitposts, scrolling past 5 suya posts take up 60% of the screen height, with avatars above they would take up 100-110% of screen height
notifications are not entirely clear about their time, grouping by date is okayish, but seeing that mention was 5 minutes ago or 1 hour ago might be important. Same goes for post time.
chats are misleading and confusing, should NEVER look like that if it's DMs we are talking about.
overall palette is extremely bland, there's no indication what's clickable and what's not, it's so monochrome makes me wonder if it's designed for eink devices in mind.
not clear how replies work, are they still inline?

Subjectively - it looks EXTREMELY bland and generic, it's looks like it's bootleg silicon valley facebook wannabe (think Path), i'm not even sure what I should be looking at - are we redesigning the whole thing now? are we taking some cues from it? How does that correlate with "we have some legacy stuff" subject of the rest of the issue?

Visiting a thread page by clicking on the time, expanding the thread by clicking on +

There was an issue (or even more than one) to allow expansion by clicking anywhere but clickable elements in the post, it can be done but should be optional

Clicking on a user avatar in a post expands the user card, but clicking on it in the card goes to the user page. Clicking on the user name always goes to the user page and never opens the card.

eventually clicking on user avatar should ALWAYS lead to profile page, and hovering over it should reveal the user card (or long press on touch, maybe even right click on desktop, too).

Settings, settings, settings. Split between two different pages.

#604

Posting is 'silent': Except for the new post appearing, there's no visual feedback that something really happened.

could do with a little animation for it, i guess

There was an issue (or even more than one) to allow expansion by clicking anywhere but clickable elements in the post, it can be done but should be optional

Many users would expect that a status when clicked should expand. Disabling that should be optional

it should be opt-out, yeah, but should be an option if it's annoying to someone, as it was with qvitter IIRC

I agree all the things mentioned in the OP are problems (most of them being tackled in one way or another already, I'm willing to give up the [+] button completely as well). I'd also add that we have way too many small icon buttons that aren't descriptive and other too small interactable elements.

I do think the designs look nice visually speaking, some good ideas there, but for our context the emphasis on titles might not be smart, and the padding/margins are a bit too much. it's coming from the right place though, as our current UI is waaayyy too cramped. I also understand that from a designer standpoint it's much better to start from too much whitespace, making it look usable, and then tighten it up than trying to do it the other way around.

I really like how the notifications look, although they've been given fairly little space if there's stuff below them, which might make them somewhat useless. we already have people complaining about lack of space for current ones. also being able to scroll down notifications further is crucial, it's something that I at least need to do frequently when my notifications get overflown with stuff and I still need to reply to something important even after hours.

I don't have anything against making the dms appear more like a chat, like other platforms already do it (twitters dms for example), I don't think the different appearance by itself is a problem. However I don't think it works with the idea of chat groups that well (tagging multiple people in dms), as it's a scope that can change at any time and we can't stop that. it's important for users to see who can see which message. on one hand this can be solved in the BE by having it create a new "chat group" every time the scope changes so if someone replies to your dm with lots of tags, it just creates a new chat group with all the new people and shows you some indication that it was split from something else if you have visibility to the previous chat. if we want it to work differently it requires way more changes to how dms work on protocol levels probably. if done with current technology it also probably means the chats can't be named

Regarding theming, I don't think a new look would get rid of it (and I don't think it should), I can imagine all these designs with a different look to them, maybe not 100% compatible with everything we have now, but with different colors, border radii, fonts, transparency, which I think is enough for admins and users alike to make their website look the way they want it.

in addition to all that, I am very open for overhauling the user experience, rethinking how it works, giving up some things to gain other things, etc. I would absolutely hate being stuck doing things the way we do them right now

also, I really like thinking outside of the box when it comes to redesigning some things, like the overall flow and hierarchy for things like direct messages, instead of having them be on the same level as picking the right timeline because of how they look and act the same currently, they can be on a different level and function differently

i'd be careful around giving up some things.

in regards of direct messages - the presentation should follow how it works. if direct messages work like direct messages - they should look like direct messages, if direct messages work like posts with limited visibility - they should look like posts with limited visibility, trying to hide and obfuscate certain things because in name of UX will end up creating more confusion than there already is.

careful, yes, but also want to have the guts to redesign things to make them more understandable or better suit their purpose

I don't completely agree, changing presentation doesn't really imply functioning differently, it's presentation after all. I don't see why having our direct message look like a say twitter direct message would not be ok for a post with limited visibility, because that's what a direct message is essentially. I think it's more weird to put private messages on timelines together with other statuses as if they were public or semi-public posts when that's not what they are.

I think problems should be resolved one at a time and redesign should be last resort. Users HATE redesigns in general especially with no good reason for it. For instance - settings pages are messy and going to get messier and messier, people are complaining about two separate settings pages instead of one - yeah it could use a redesign. Redesigning the entire thing just because we though it's not user-friendly enough? That would make some people angry. Redesigning posts to have avatar on top of post because why not? Seems uncalled for. Removing panels and background? "Why????"

I think the "why" is pretty clear, a redesign isn't done to annoy existing users, it's done to make the platform more viable for new users. of course many of the proposed changes can be argued if they are better or not but that doesn't mean a redesign should not be an option

direct messages: I plan to introduce api endpoints on the backend that make DMs work like chats if you go through them, and that would then match more with the chat view. As it is now, people don't know how to send DMs and can't figure it out on their own.

direct messages: I plan to introduce api endpoints on the backend that make DMs work like chats

isn't that mastodon conversations API?

That's what you'd think but no, it isn't.

t. thought that it was that and found out after implementing it that it's something different.

I think the "why" is pretty clear

no it's not clear. i fail to see how redesign is going to fix new users problem. i can see how changing SOME things can help, how fixing existing issues can help, but "hey there's the new ambiguous and highly questionable design" is not going to help on its own.

direct messages: I plan to introduce api endpoints on the backend that make DMs work like chats if you go through them, and that would then match more with the chat view. As it is now, people don't know how to send DMs and can't figure it out on their own.

and just how it will work if someone DMs you from mastodon and you DM back from pleroma? How it will work if someone "adds" someone else into thread? Is it gonna be compatible with that at all?

The sidebar could slightly change, depending when using Pleroma chat, groups and TWKN

The UI proposal looks very similar to ~~Twitter~~ Pixelfed MicroUI

I also do think we need to do some heavy refactoring in code as well to allow for ui refactoring, I think our components are massive and they have too much logic inside them, I think even with vue we can go for smaller components which make larger concepts (like a status or a notification or a user card) easier to manage

I think kaniini mentioned something about using MicroUI components in PleromaFE

with no disrespect to dansup's hard work, I'm very cautious about any suggestions like that. microui was made originally as a monolithic single vue component application and what I want is the opposite of that. porting components over from any other application to pleromaFE is gonna require as much manual work as just writing from scratch I think

my biggest concern with themes and customizability is lack of panels/columns. I understand where idea comes from but I think it's too limiting.

You cannot use background image anymore because it will make text unreadable. Possible solution - bring avatar/handle into the post "bubble" but then it's not much different from what we already have (still borders which design strives to remove, but thicker = worse)
potential to have mastodon-like multiple columns greatly reduced. Currently having panels/columns allows possibility to add more column into the screen if you want it, it's not implemented but i do want to implement it as an option for power users, with proposed design having several columns would be more confusing and weird because of lack of borders.

for wallpaper/background, I personally think it's something that could be sacrificed, but I don't think this design forces us to do so anyway, I can imagine the proposed design being in 'panels' just with the option to not have a wallpaper and the background of the timeline/card/notifications/whatever blending in perfectly with the background color for a less busy look

I don't see giving up mastodon-style multicolumn possibility as a problem, the hasn't been really much enthusiasm for it in pleromafe before apart from "guess it could be made" and mastofe still exists. I'd rather go all in on our own layout than keep a potential future option for something that already exists.

if you ask people around fedi "are you ok if we remove ability to have cool themes and background images" what you you think people will say? I honestly cannot see how background image could work with such "panel-less" design.

i DO want multiple columns, i don't want to use pig disgusting mastofe, i'd rather update pleroma-fe to be customizable and easy to use. The problem is, multi-column is like 6 years in the future in backlog, we need lists first, we needs some basic expected functionality (settings sync, emoji picker, notifications controls and sounds) first.

I mean sure, some people won't like any of the changes we do, people who are used to something don't want change. asking only people who are used to status quo won't help with the big picture. the question isn't "do you want us to remove stuff" it's more like "do you want a less busy UI", which is more important for people not used to the software already.

I don't know, I see multicolumn as a very "power user" feature, not something that makes people want to use the software, and also if we plan on making everything work on mobile anyway I don't see why one couldn't use the thin designs of that for a multicolumn layout. when it comes to priorities, I think making new users not turn away when they can't figure things out is very important.

we can make default background image a solid color, maybe even make a shadowless default theme (and add option to customize dark underlay to make it possible which is planned for themes v2.5) to make a less busy UI.

first thing first - multicolumn could be made to work with mobiles the way twidere does where you just scroll horizontally between them and have a switcher at top. Honestly, twidere has some really nice ideas, we should take more (user highlight came right from it, especially with striped background)

Secondly - you shouldn't value "potential new users" more than existing ones. You can always fuck up redesign so hard new users still won't like it and existing ones will hate it so you get a negative net profit, so keeping your userbase is more important than trying to appeal to mystical new users that may or may not exist.

Lastly - is "can't figure it out" really a problem? Our UI is as simple as some older twitter designs, probably even more simple than that. Masto had this problem because they went with fucking tweetdeck poweruser style from the get-go and even they made simplified version an option

"I can't figure things out" is absolutely a problem. Every new user I showed the interface struggled with it. The story in the OP about people not knowing if a post actually posted is not made up. People also think that when they click TWKN, the status will be posted to the TWKN, and so on. Same goes for thread expanding, which some people just don't find.

see? if you can make stuff look less busy with just theming, you can make it work the other way around too, we can have UIs that are designed to look less busy like in the sketches and still have them support theming.

yeah how mobile works is another thing, gestures work a bit shit on mobile but a proper tab bar is cool, but my point was that no matter how we do mobile and support a thing layout for every view, it means those layouts could be used for a tweetdeck style multicolumn system so we don't necessarily lose the option for that multicolumn you wanted even with redesigns, so I don't think that aspect is holding us back in any regard

regarding the other points, when we're a very niche thing with a lot of room to grow, I think making everything more approachable/intuitive is a much bigger concern than a small user base. I do think it's a problem that people can't figure things out, like lain already wrote in the OP. I've seen comments from people coming from other platforms, including qvitter which wasn't that great but it was easy to figure out.

I don't think we're close to the simplicity of even old twitter for many reasons. some of the reasons are thanks to fediverse being a much more complicated domain with way more concepts the users need to know, and some of them are to do with the UI itself (good and bad), listing some of both: scopes, lots of icon buttons (and some icons that are not buttons mixed in), the imageboard style reply navigation and previews, subjects, freeform attachments, post format, shit ton of options in two places, notifications column always in view with an additional "Read!" button, notifications not actually behaving the same way as statuses, the user cards, opening statuses and profiles externally, tagging people, remote follows, multiple ways of viewing a conversation, custom emoji etc. many of the things are good and/or necessary but it's still more complexity in total, and working on top of the underlying complexity makes it even more of a challenge to be intuitive for new people

People also think that when they click TWKN, the status will be posted to the TWKN

no joke this is what I thought when I first tried spc with qvitter

It's a logical thought.

i don't think we can really solve that problem though... well except for moving navigation where it should be and away from post form, but i think people will still think posting is made to active timeline

see? if you can make stuff look less busy with just theming, you can make it work the other way around too, we can have UIs that are designed to look less busy like in the sketches and still have them support theming.

I still don't understand the "other way around" though. If you're saying we should use less busy default theme then maybe yes? That kinda hides potential even more though, and it's another topic really.

we don't necessarily lose the option for that multicolumn you wanted even with redesigns, so I don't think that aspect is holding us back in any regard

it's just more confusing with that panel-less style if we actually do that, it will be confusing even with minimalistic theme i made, existing interface already kinda is.

looking at old twitter design, i'd say pleroma-fe is about as complex as it, all things considered - some parts are simpler, some things are more complicated. The thought i'm conveying - problems should be isolated and dealt separately. People think switching to TWKN will post to TWKN - move away the switcher to reduce confusion. Not knowing if post was made - add confirmation animation. Thread expansion - add click on post and maybe move + next to retweet/fav buttons like old twitter did. So far, as I said before it's slowly devolving into long exhausting banter.

but i think people will still think posting is made to active timeline

Posting should only happen to the active timeline. Anything else is confusing to users. Allowing setting scope in the post form is very much a power-user design choice, not something modeled after human behaviors.

what.

ok, how do you post to someone else's profile then?

All in all I can say that each problem, even if it's UX problem should be approached separately and for many of those there are issues open already.

"Let's throw it out of window and start over" is not a solution.

Redesigning whole thing is a no go.

For everything else it should be discussed separately for each aspect. For instance sidebar (ex-top-bar) is a neat idea and close to something I wanted to do before. Currently this issue has potential to devolve in shitstorm, drowning out good ideas.

Do you mind if the navbar gets moved to the bottom, like in the example?

only for mobiles, navbar at bottom for dekstops is generally weird - not where you'd look for a menu.

I don't agree with that at all. The idea is not to get one design into place right now, but to also think about more radical changes to the UI that can't be achieved by moving one thing to a different place. The current PleromaFE became the way it is because there was no overall theme beyond 'make it look kinda like twitter', and then we just added features / panels as they came along. This works fine for existing users, but new users are often completely lost and just stop trying.

So I do think that having an actual redesign as a guide for the future is very useful. @sheueyen 's attempt is meant to show one possible direction.

We don't even have some of mastodon's basic features (emoji picker, lists, fields entry), we just barely released 1.0 and you already want a complete redesign and radical changes? There's nothing radical in the proposed design, there's nothing in that design that makes it easier for new users to use it, if anything - it doesn't even feature a post form which makes it even more confusing.

I feel like you just want to start from the scratch for sake of starting from scratch, or rather, start from scratch but not really. Do you seriously believe Going from "make it look kinda like twitter" to "make it look kinda like tumblr" is going to make a difference to new users? or make a difference at all?

I think it's possible to still keep theming on this UI by automatically changing the font color depending on background color and brightness. Similarly seen on newer versions of the Android statusbar

font color changes automaticaly already, problem is that having background image right below text with no underlay between makes it incredibly hard to read. See: older user card designs.

Does all the text change color at the same time or is it directly dependent on the background, the element is in?

mentioned in issue #625 (moved)

added Discussion label

Has anything been done towards this UI since?

mentioned in commit 526b43eb

moved to pleroma-meta#40

Future UI/UX

Designs

Child items 0

Activity