A few more UX issues

1

I am bringing this from the github issue to this forum for a broader discussion.

When adding a contact, you need to type in a textfield at top, that is hard to recognize as text field, because it looks like a screen header. The page would profit from a static “Add contact” button like the “add group” buttons, either in addition or as only option.
All three buttons should have more distinctive icons than a +, so you can choose the right one intuitively.

(See images in the github post, new users cannot post multiple image in this forum)

In addition it is confusing how to abort adding a contact, e.g., to add a group instead. Touching the left-arrow goes back to the previous screen, even when it is placed next to the input field. The x does work, even when it is more commonly associated with “close” (possibly going back to the previous screen?). This could all be solved by adding a button “add contact” instead of this indirect flow.

In contrast, when adding a group, the screen looks like this:
(See images in the github post, new users cannot post more than one image in this forum)

Here is a lot of white space, which could be used to list the contacts, that can be added to the group (and possibly a textbox for filtering the list), instead of of opening a second screen.

Finally, the “archive” icon when selecting conversations is not obvious at all. I do not even know what the icon should depict, and especially do not know what function it may have. It is not available in the “…” menu, so I cannot read what label may match the icon, either.

I do not know, if you may already have some of the issues on your roadmap, I just thought when I am trying it again I use the opportunity for some “first impression” feedback before I get used to the way Delta chat handles these functions and do not notice the issues anymore.

1 Like
2

First page I found unintuitive:

500×889 84.6 KB

I saw the textbox at top, but I saw the “Add Group” / “Add Verified Group” buttons much faster. I would have expected another “Add contact” button there. The textbox on top may or may not be used as input for this button.

When you start typing, a button appears, that shows “New contact” and the incomplete e-mail address or the placeholder “Please enter an e-mail address” for invalid addresses. In addition, the other buttons and contacts disappear.

Suggestion: Always show the button together with the placeholder “please enter an e-mail address”. It is clear from the placeholder, that you need to enter something first and it is clear from the live update of the subtitle, that the address entered on top is used.

3

Minor issue: When entering mail addresses, Deltachat changes the placeholder when a valid address is detected, but it uses a too simple verification. It for example expects a top-level domain with at least two characters. Using delta-chat in a LAN (or with a internet-server, that only uses internal addresses like user@mail) is not possible that way.

4

Adding a group on the other hand uses a button that opens a new activity:

Screenshot_20190405-163816
Screenshot_20190405-163816500×889 42.6 KB

The answer on the unused space is:

wrt the space in the group creation screen: this is used for the selected group members, so it is not wasted. and having a full list here makes an overview about the selected members harder.

So this space usage is okay. But the flow is still different for adding a group and just adding contacts. As an average user I would expect they to be similar. So when the group creation would work like adding contacts, you would type the groupname on top and then press the “create group” button.

I can think of a flow that works like this, either showing the second activity afterwards or even adding the additional controls (like “show QR-code”) in the same screen when the user starts typing, but I am not sure if this is the best flow.

Textinput: [startedty     ]
---
Contact: startedtyping@test
Contact: startedtyping2@test:
Button: [new contact (startedty)]
---
Groups:
Group: startedtyping
Group: startedtyping2
Create new group:
Buttons: [QR-Code for startedty] [Create group statedty and add members]
5

In general, I have the impression that you like to have list-filtering and adding contacts on the same page using the same input box, but I am not sure if this is the best UX.

I would think adding a contact is a three step action:

  • Click add new contact
  • Enter an ID somewhere
  • Click a confirm button (e.g labeld “add”)

While this seems to take a step more than you wanted to implement, it is a common flow and at each step I am sure what the next action will do.
In your flow I ask myself for example, if “new contact - started@type” will instantly add the contact, open a new activity or show a confirm dialog (as it currently does).

List filtering is a one-stop action:

  • enter the search text in a always visible search box

This works just fine in the current implementation.

1 Like
6

An idea for a larger change:

What about adding tabs to the home screen? Have one tab with open conversations and one with the buddy list and you avoid the flow where the user needs to use two add buttons in a row (first “+” than “add contact”) and you do not mix “+” as “start conversation” with “+” as “add contacts” anymore.

The tabs could either be always visible like in Whatsapp or you could possibly swipe between them and/or use a swipe-from-left sidebar.

7

Here is a pattern used by Conversations.

800×1422 105 KB

In the background is the list of current contacts (redacted for privacy reasons) and the add button in foreground opens a list with four possible add actions and changes the plus button to an x-button, that hides the options.

8

About the textfield at top, I don’t think it is hard to recognize as text field since it is focused and have the blinking cursor “|” and also the text “enter name or email” is self-explanatory but maybe an horizontal line would make it even more obvious

9

agree with this, the icons to archive and unarchive, suggest downloading and uploading to me, this may lead to user expectations that this feature does something related with the server (ex. “use the network to archive”)

10

Also agree with this, there are no obvious way to add a new contact, users don’t know they have to start typing the contact to see the “add new contact” button because that bar is supposed to be to search existing contacts not to create a new one, IMHO it would be better to always show the “add contact” button and on tap, show a new form like the one for groups but with settings for contacts like Display name, email address, and maybe even let set notification sound here

11

As said, a streamlined “new chat” activity may allow to “select contacts” (one or more, new or existing):

  • showing a (checkbox) list of existing contacts
  • sorting all selected ones to the top, with a separating line before the non-selected
  • two buttons in the footer area:
    • a “search/create” button, opens the keyboard with a text entry filter field applied to the list, together with a button, to create a new contact with the entered address.
    • a “start chat” or “start group chat” depending on the number of selected contacts.