Date: 2020
Platform: Desktop application, Adobe XD
Setting
Individual examination for the course Graphical Interfaces at Chalmers University of Technology
Challenge
The Covid-19 pandemic has increased our acceptance of remote collaboration work. The final assignment for this course in Graphical interfaces was to design a graphical user interface for a remote collaboration tool, where a video meeting application (such as Zoom) meets a collaboration and sketching tool (such as Miro).
My role
Research, UX & UI design
BACKGROUND
The scenario was a group of around a dozen professionals working on a creative project, both with text and images.
The required features for the assignment were:
- Video feed with useful data such as participant name, and icons for different status (muted mic, host, co-host, etc). Video of course includes audio.
- Basic controls such as mute mic, mute camera, select camera, etc.
- Common, collaborative canvas area for co-creation and manipulation of things such as
- Text
- Mindmap
- Post-it
- Simple graphics such as flowcharts
- Imported graphics
- Representation of who has created what content, and who have and who is editing what content.
- A way to create, select, and move between different break-out groups. Especially care for creating a good overview.
METHOD
I started out doing market research to see how competitors had solved the different problems stated in the problem statement. Wireframes were created and evaluated together with potential users.
RESULT
The final design was a desktop application that supports online collaboration. It supports communication in the form of video or chat messages as well as a comment function. In order to see who has worked on what, it is possible to hover over details on the board. Everyone working on the document are individually shown as little arrows, much like in the Miro online application. The idea was to make the application "playful" (such as the video being able to be shown as bubbles) yet be able to deal with large and different amounts of information.
Future work could include how to access the different canvases from the main room.
Choosing video view
Grid view
Bubbles view
Creating a break-out room
Tracking changes and leaving comments
Using tools
