EC Video rooms - UX review

[gaelledel]

07/12/22
Testing on Develop.element.io / Web
Chrome browser
Version 107.0.5304.121 (Official Build) (arm64)

Test cases

• - Join a call with multiple participants: Works
• - Move tiles: Works
• - Change theme : Works
• - Open chat : Works
• - Change room: Works
• - Return to room: Works
• - Change mic: Works
• - Change cam: Works
• - Change layout: Works
• - Move tiles: Works
• - Change tile size: Works
• - Add user to the call: Works
• - Leave: Works
• - Change viewport size: Works
• - Mic ON OFF: Works

Fail during test

• Chat notifications: Fail - On mention notification no red badge in the room list / No red badge on chat icon in the video room

• [PIP: When camera is OFF, The avatar bubble is too low and overlaps with the buttons. We need to shift it upwards so in the middle on the window
  -PIP: Fail - the frame appears on Light mode but there's none for Dark mode. This might be caused by the background colour on EC being the same as the frame colour for Dark mode. In this case we could change the background colour to another value or remove the frame - @gaelledel to investigate
  @robintown Could you tell me the value of the frames and the backgrounds for both themes please? I would like to make sure we both have the same values

-PIP: On Pip, the Mic button does not work - Camera button stays on On state no matter if camera is on or off

• - Cam ON OFF: Fail - Camera button state remains ON
• - Share screen: Fail - Other participants cannot see me presenting screen

[gaelledel]

@robintown I had to change the design of the PIP for the issue described above. Please find the design specs here: https://www.figma.com/file/STqNwYb2rCXxHAAku2JQA7/Element-Call-Integration?node-id=1107%3A82842&t=OXpbvCJJLP0QJX9U-4
I have created a GitHub issue for this here element-hq/element-web#23980

You can therefore disregard the remarks above for the frame issues.

For Light theme:
-The back arrow colour will change to Quarternary/ Light

• Text string and hang up icon change to Background/Light
  As an alternative we can simply use the colours defined for Dark theme.

I also had to change the icon of the hang up button which mean the button will need to be edited Specs here: https://www.figma.com/file/AjvSw4lI9iGO5aTe4WAl4r/Element-Call?node-id=1238%3A55293&t=8awS97kLVn0XLnFW-4

[robintown]

@gaelledel Heads up, because of technical limitations related to the controls being directly overlaid on the picture-in-picture view, I wasn't able to keep Jitsi's control bar working in the new design. Instead I've given it the same layout as Element Call, which just has the 'leave' button at the bottom and nothing else:

Element Call	Jitsi

[gaelledel]

@robintown Right no bother it's looking good!

[Half-Shot]

@gaelledel @robintown are we happy to close?