Improve UI design

[mschaaf]

http://view.jquerymobile.com/1.3.2/dist/demos/faq/how-does-theming-work.html

[GeorgHofmann]

Ok, I tried to catch a easier ui for the whiteboard. We should keep it very simple, without too much clicks. For whiteboard, we don´t really need a drop down list for size/color. Better is to show colors and pen size. The UI for whiteboard is very simple and for users it is very easy to understand what we want.

[GeorgHofmann]

[GeorgHofmann]

[mschaaf]

NIce. What does the third symbol in the bottom status bar mean.

[GeorgHofmann]

First at all: I like to show icons with a very simple status (success or not), therefore the checkmark. I am not really sure to show icons with a opacity (enabled/disabled). It very depends on the contrast of each users monitor settings. If you are ok with that I would like to work with checkmarks instead changing the saturation or opacity. Colorblind people will love it. huestel

The second, I will iterate the 'pick-up colors'-bar etc. before I will start to create unique ui for every status. The toolbar was only a suggest and for our requirements it´s not really import, with other words it´s overdosed. So I will check and make suggestions regarding a common toolbar.

[mschaaf]

Yes showing state not only by colors is a must have. Checkmarks are ok but we shouldn't use checkmarks now everywhere instead I would suggest to think about every icon state if a checkmark makes sense or something else is better.

Yes too a common toolbar makes sense. I don't like 3 different thinks like in the last screen shot color bar with pencil then then the ps like menu and the one in the status bar. Instead of copying something we should think about how we achieve our goal with the best solution. Before solving this I would like first collect what elements we want.

Please all help here at or remove things to this list:

• drawing element size
  • we should have some predefined sizes e.g. 5 to 10 sizes
• drawing element color
  • we should have a predefined list of colors e.g. not more then 20
• drawing elements
  • point (freehand painting)
  • rect
  • circle
  • text
  • arrows
  • lines
• eraser
• save
• new

[mschaaf]

@GeorgHofmann does it make sense to have for whiteboard ui for text chat ui and for common ui separate issue?

[GeorgHofmann]

Hi Mascha,

I am not sure if we should open different issues for the different parts of QQ. For the first time I made a first suggestion. But I would like to sleep one night before I continue to work on it. Additional your feedback to first mock could help to improve quicker the drafts.

[GeorgHofmann]

[GeorgHofmann]

Additional thoughts with pending mocks:

• drop zone box overlay for background attachment
• second approaches for the active icons (new message/new drafts to the whiteboard)
• Showing list of different whiteboard sheets (dropzone)
• search field has different states
• for some cases we should use tooltips to show complete
• the complete content between header and footer is only scrollable, rest is fixed

[mschaaf]

@GeorgHofmann I would recommend to remove the send/post button.

[GeorgHofmann]

@mschaaf, I iterated the ui with other colors.

[mschaaf]

For me two lines of input are to small i would recommend to resize it in case you add a third line until we reach a seted limit.

[mschaaf]

The light green in the menubar is for me to light.

[mschaaf]

Did I say that I like it? 👍 It is very clean. Could you please describe the use case of the buttons in the bottom.

[mschaaf]

Could you also please add the color codes for the different colors so that we can integrate them and see live how it looks.