Deltachat-desktop: UI/UX plans?

[Jikstra]

Currently the ui/ux is quite basic/unfinished. Are there any plans/ideas on what to achieve? Talked with hpk a bit about it, but i'm not sure what deltachat-desktop should achieve from a ui/ux perspective.

Some key points which are important in my opinion are:

• intuitive ux => usage should be similiar to whatsapp/telegram (that's what people know to use)
• colors/ui/branding like the android client
• deltachat specific things like settings/send;received;read hooks/encryption indicators should be the same on all platforms (if possible & makes sense)
• clean & simple interface, no crazy effects...

The signal people didn't put much effort into the desktop ui in my opinion, but i think we can improve it quite easy.

Would like to hear any other input from you, especially @karissa @ralphtheninja @r10s @hpk42

---

Issues:

• [ ] Add lock for encrypted messages https://github.com/deltachat/deltachat-desktop/issues/144

[ralphtheninja]

Design and css definitely needs a lot of love.

[r10s]

@Jikstra thanks for pointing this out.

i agree to all points.

a nice ui is very important and cannot be underestimated imho. also at least a similar look between android/desktop/ios.

i think there are lots of low hanging fruits with a lot of impact as: color the title bar, left-align the title. do not split things to sandwich-menu/menu-bar, font-size, spacing.

so, for the beginning, maybe some basic css-knowledge is sufficient, however, i have no idea how complicated already "empty" css are in node.

[hpk42]

@Jikstra just mentioned (he is sitting in the same room as me)
that the underlying CSS-framework was last updated 2011 --
kind of the stone age of javascript IIRC. It might have
big museal value ;)

On Mon, Oct 08, 2018 at 13:36 -0700, björn petersen wrote:

@Jikstra thanks for pointing this out.

i agree to all points.

a nice ui is very important and cannot be underestimated imho. also at least a similar look between android/desktop/ios.

i think there are lots of low hanging fruits with a lot of impact as: color the title bar, left-align the title. do not split things to sandwich-menu/menu-bar, font-size, spacing.

so, for the beginning, maybe some basic css-knowledge is sufficient, however, i have no idea how complicated already "empty" css are in node.

--
You are receiving this because you were mentioned.
Reply to this email directly or view it on GitHub:
https://github.com/deltachat/deltachat-desktop/issues/138#issuecomment-427970686

[Jikstra]

@r10s

i think there are lots of low hanging fruits with a lot of impact as: color the title bar, left-align the title. do not split things to sandwich-menu/menu-bar, font-size, spacing.

Yesss.

so, for the beginning, maybe some basic css-knowledge is sufficient, however, i have no idea how complicated already "empty" css are in node.

Yup should be enough. I'm currently going through the code and what i noticed is that the blueprint css framework is used. Don't know it, but it seems like it's last update was in January 2011, which is not really a good sign. Besides that we should also implement something like sass. Maybe.

[ralphtheninja]

Maybe we can just start trying to find out what needs to be done, in more practical terms and create issues for it.

[Jikstra]

@ralphtheninja yes. Maybe we can start figuring this out in this thread.

Some ideas i have:

• Splitted view of ChatList & ChatView, we have enough space for this on desktop + for the future making the chatlist resizable/hidable
• Styling avatars in the same way as deltachat
• Styling sent/received the same way as dc
• Styling encrypted/unencrypted same as dc
• Same icons/colors/fonts

[ralphtheninja]

Splitted view is something @karissa has been working on / looking at, so it's sort of in the pipe already.

[Jikstra]

I think we will come across some things which are in the pipe because i have to get synced with all the things which are currently in the pipe or where something already has been done or is known... :)

But nice that you're already working on it! A short question as this already is a chat thread, is the conversations module completely self written or ripped out of signal?

[okdistribute]

Nothing is in the pipe. Please feel free to PR. We can prioritize things that are already issues, especially issues from folks not on the main development team.

[okdistribute]

Blueprint provides more than just CSS. And oftentimes in JavaScript/css land, the frameworks that are rapidly edited (like material-Ui) become difficult to keep up with and provide more work in the long term for updating to latest code and working out dependency trees. If we want to override the colors or specific looks and feels, that can be done