Wire-webapp: [User Experience] The UI looks good but is bad to use

[ghost]

The Wire UI looks kind of slick but in my humble opinion, is kinda bad for newbies (and still comparatively less super clear to look at than all the other messengers I use after getting used to it).

I'll list the few things that bother me the most, and how other messengers compare:

1. The chat messages visually blend a little into each other, the reason being that they are only separated by a too low contrast thin line for separation. Compare Skype, Threema, Telegram: all of them don't suffer from this because they use actual bubbles (to separate same messages from same person clearly) with contrasting colors for at least all the other people (to make messages clearly stand out from the scroll view in general). You may consider bubbles & stark colors less sleek, but it works a lot better

2. The text bar at the bottom visually blends into the text area, again the reason being it's almost the same color as the text bar (=low contrast) and the "Type Message" text also is way too low contrast and barely visible, so if you don't know it's there it's easy to miss. With the icons in it, it actually looks like some kind of toolbar or statusbar at first glance, especially on desktop/web, where there is no visible send button. Compare Skype, Threema, Telegram: all of them don't suffer from this since they have visually much more clearly separated input lines, again by simply using much more contrast to separate it from the content area, and using more contrast for the prompt text that tells me to type there

3. The sidebar with the wallpaper and the size is way too eye-catching compared to the actual chat window, because the chat area is just an almost purely white low contrast area that doesn't stick out much, and the busy wallpaper with strong colors of the sidebar really draws attention. I'm not making this up, the first time I opened wire as a user I thought the main area was the sidebar for a second, it is disorienting. Compare Skype, Threema, Telegram: none of them suffer from this, because the sidebar is either unobtrusive in a single solid color (Telegram, Skype) or not present in the first place (Threema) when chat is open.

4. The sidebar with the accounts being titled with my account name is confusing. I know it's meant to refer somehow to my local device, but it would be much better to just write "Accounts", "Chats" or whatever, something what the sidebar is actually for. You may think this is obvious, but it's just again another initial confusion when being new to the app. Compare Skype, Threema, Telegram: they don't suffer from this since Telegram doen't have a title above the accounts sidebar at all that could be in any way misleading, Skype clearly titles it "Chats" and Threema simply writes "Threema" on top - no potential for confusion that the list is about something else.

5. There is no useful UI integration for end-to-end encryption. I simply can't see easily before/while sending a message whether the target is trusted, at leaast not that I know of. Of course it's in the details for the specific user which I can open up, but who does that every time before sending a message? In practice, this means I almost never check it. Compare Skype, Threema, Telegram: Threema doesn't suffer from this since it's always super obvious due to the huge traffic light always visible at the top of a chat, informing me whether the connection is fully trusted. Skype/Threema admittedly don't support the same ubiquitous e2e encryption, so they kind of dodge this.

All in all, Wire compares pretty badly for me right now. This is just my personal feedback, maybe other users don't share these troubles - but if any of them do, I suggest you do something about it

[maximbaz]

I simply can't see easily before/while sending a message whether the target is trusted, at leaast not that I know of.

1. Settings > Devices and set "Verified" for each of your own devices.
2. Select a contact, click on their name in the top middle screen, select Devices and set "Verified" each of their devices.

After that, you will see a protected icon next to their name:

As soon as you or they add a new untrusted device, you will receive a big shiny popup saying that your conversation is no longer private until you verify the new device. Also the protected icon will disappear.

[jennifergoertzen]

Hi @JonasT

@bennyn passed along your feedback to me. I’m on the Design team at Wire. I apologize for the late reply.

First and foremost, thank you for sharing this feedback with us. It’s awesome to have a piece of software that people not only use but also want to push it to be better.

The chat messages visually blend a little into each other.
I agree with your point about visually blending between messages within a conversation. The way it is styled doesn’t create a lot of separation between one message and another. I’m going to explore this with the design team—I think we can come up with something that is true to Wire and a better experience for the user.

The text bar at the bottom visually blends into the text area.
Thank you for bringing this up. Contrast—or lack thereof—is something that we are looking to address in the future of Wire. We want to create a more accessible design and this would be a part of it.

The sidebar with the wallpaper and the size is way too eye-catching compared to the actual chat window.
The conversation list (the name we’ve given the sidebar) being too prominent on the app is a well-known issue for the Wire Design team. As it exists today, the conversation list is a result of many different variations explored over time. Revisiting it once again is on our list for the future. Your feedback here has given us more insight into what needs to be improved, so thank you for that.

The sidebar with the accounts being titled with my account name is confusing.
We show the name at the top of the sidebar because a person may be logged into up to three Wire accounts at a time. The name at the top can give them extra context as to which account they’re currently viewing.
That said, I do have a question for you: when you first saw the name at the top of the list, what did you think it was? Did you click it? I’m curious to know more about the confusing aspect of it.

There is no useful UI integration for end-to-end encryption..
Thank you, @maximbaz, for your comment about the verification flow in Wire. I hope that was helpful for you, @JonasT. If you have any more questions about it, please let me know.

---

Thank you again for sharing your feedback. We are continually iterating on what we create although we may not be able to double-back and make changes immediately. Please let us know if you have any further suggestions—we really appreciate all the feedback.

[ghost]

@ sidebar: I thought for a second I was looking at my own user profile or something. Of course I realized I was wrong a moment later, but the initial impression is just a tad confusing. I think the reason is that it doesn't describe what the list below is, while placed like a title above it. I think something more verbose like "Contacts for <myaccount name>" which accurately describes the list would solve this

[jennifergoertzen]

That makes a lot of sense. When using other apps, we're accustomed to seeing our own name above info about us. Thanks for the additional info, that's really helpful.