Convay Webinar
Convay Webinar supports large-scale virtual events of up to 5,000 participants, providing an optimized platform for conferences and large gatherings. The host can easily switch between standard meetings and webinars based on the event size. With a streamlined interface for managing participant requests and a backend designed to handle high volumes, Convay Webinar ensures a smooth, engaging experience for both hosts and attendees.
CATEGORY:
Web Design,
Product Design
ROLE:
UX Designer,
UI Designer,
UX Researcher,
Interaction Designer,
Information Architect
TOOLS:
Figma
About Convay
Convay is an innovative video conferencing platform that redefines virtual collaboration by integrating tools for seamless communication and teamwork. Designed with the needs of modern businesses in mind, Convay goes beyond traditional video calls by offering a unified platform that manages all aspects of meeting lifecycles—from preparation and execution to post-meeting follow-ups.
The platform provides enterprise-grade security, ensuring data privacy with end-to-end encryption and secure cloud storage. Key features include high-quality audio and video conferencing, automatic transcription, real-time collaboration tools, and centralized file management through Convay Cloud. Users can organize meeting files, access chat logs, and navigate through media and documents effortlessly. Additionally, Convay supports complex requirements with scalable architecture, making it suitable for organizations of all sizes.
With specialized solutions like AI-powered transcription and summarization, cloud storage for document management, and an intuitive interface for navigating content and activities, Convay aims to create a truly cohesive virtual meeting experience that enhances productivity across teams.
For more details, visit Convay.
Feature Overview
Convay Webinar is designed to handle large-scale virtual events and conferences, with a streamlined setup for both small and large gatherings. The interface, called the "middle layer," is where users can manage all aspects of meeting setup, including scheduling, setting meeting details, and choosing participant limits. This middle layer is not a new technology but rather a user-friendly UI that brings all meeting-related tasks into one place.
Through this interface, users can select the type of meeting based on the expected number of participants. For smaller groups of up to 200 participants, the platform initiates a regular Convay meeting, ideal for small to medium-sized gatherings. For larger events with up to 5,000 participants, Convay Webinar mode is activated. This mode is optimized for large conferences, ensuring that even with thousands of attendees, the platform runs smoothly and keeps the experience engaging.
Middle Layer Interface for Meeting Scheduling
The Middle Layer Interface in Convay serves as the main hub for organizing meetings and webinars, making it easy for users to set up events of any size. This UI layer provides a seamless way for users to switch between different meeting types based on participant count, ensuring flexibility for both small group meetings and large webinars.
Users can customize event details directly within this interface, starting with the meeting title and participant count. If the event expects up to 200 participants, users can set it as a standard Convay meeting, perfect for small to medium-sized gatherings. For events expecting up to 5,000 participants, users can select the webinar option, designed for larger conferences and public events.
Convay Middle Layer
The Middle Layer Interface also includes scheduling options, allowing users to specify the date, time, and time zone, as well as options for recurring events. From this central UI, users can access various setup controls, such as attendee permissions, participant roles, and unique meeting ID generation. This interface ensures a streamlined workflow, where everything related to meeting and webinar setup is handled in one place.
Host Controls and Attendee Management
The host controls in Convay Webinar are designed to allow seamless interaction for large meetings while keeping the conversation organized. With the Main Attendee List View, the host has an overview of all attendees, showing their roles (e.g., presenter, guest) and current permissions. This list enables quick actions for each attendee, such as inviting them to speak or adjusting their access.
When a participant wishes to speak, they can use the Request to Talk Notification option, which notifies the host. The host can then either approve or deny the request. Once approved, the participant’s view updates to Approved to Talk View, where they have speaking access, while the rest remain muted to maintain focus on the approved speaker.
The Allowed to Talk Tab and Wants to Talk Tab make it easy for hosts to manage who has speaking privileges. The “Allowed to Talk” tab displays participants currently permitted to speak, allowing the host to revoke permission if necessary, while the “Wants to Talk” tab lists those waiting for approval, simplifying the moderation of large groups.
Additional features include the Invite Options for Attendees, where hosts can invite users as either presenters or guests, adding flexibility for structured events. The Manage Attendee Options offers further control, allowing the host to grant speaking permissions or remove users from the meeting as needed. These functionalities work together to create an efficient and structured environment, enabling hosts to manage even thousands of participants without confusion.
This system ensures that the flow of communication remains smooth, with only approved speakers active at any given time.
Main Attendee List View - Shows all attendees with their roles (e.g., host, presenter, guest) and allows hosts to see details and manage permissions.
Request to Talk Notification - Displays when a participant requests permission to speak, allowing the host to approve or deny the request.
Attendees View - Shows the attendees view with the participant’s video enabled, while others remain muted.
Allowed to Talk Tab - Hosts can view participants who are allowed to talk and remove permissions if needed.
Wants to Talk Tab - Lists participants who have requested to speak, allowing the host to manage permissions.
Manage Attendee Options - Hosts can give talking permissions to individual participants or remove them from the meeting if necessary.
Invite Options for Attendees - Allows the host to invite participants either as presenters or guests, adding flexibility for large events.
Applying the Design System to Components and UI Elements
With the foundational variables and styles established, I applied these elements to create a cohesive, scalable design system for Convay’s UI components. This step involved building out reusable components using the defined colors, text styles, spacing, stroke widths, and effects, ensuring each part of the UI adheres to the new design standards.
Buttons: I used the global color variables and spacing options to design different button states, such as primary, secondary, active, hover, and pressed. Each button is visually consistent with the brand colors and provides clear feedback to users during interactions, enhancing usability.
Icons and Badges: The icons and badges across Convay were updated to align with the new color scheme, using accent colors for alerts and notifications. Each icon’s stroke width and corner radius were adjusted based on the defined variables, ensuring they are visually harmonious across all screens.
Forms and Input Fields: The design system also covers form components, including text fields, dropdowns, checkboxes, and radio buttons. Using standardized text styles, colors, and spacing ensures that all forms look consistent and feel intuitive, reducing cognitive load on users.
Modals and Dialogs: Modals were designed with proper elevation styles to give them prominence on the screen. The standardized corner radius and shadow effects make dialogs visually distinct, helping users recognize important messages or actions.
By applying these styles across various components, we achieved a unified look and feel for Convay. This structured approach improves user experience, making interactions more predictable and intuitive, while also making it easier for developers to implement consistent designs.
Participant Experience
In Convay Webinar, we designed the participant experience to ensure ease of use and seamless interaction for users attending large events or conferences. The interface is crafted to facilitate an efficient flow from passive observation to active participation, based on permissions granted by the host.
When participants first join a webinar, they enter a Participant Viewing Mode where they can view other attendees but are restricted from direct interaction. This initial setup ensures that large meetings remain organized, with participants primarily listening and observing the session.
If a participant wishes to speak, they can select the Request to Talk Button, which sends a notification to the host, signaling their intent to engage in the discussion. Once the request is sent, participants see a Request Sent Confirmation screen, giving them reassurance that their request is being processed. This feedback mechanism reduces uncertainty for users waiting for approval.
Upon approval from the host, participants encounter a Request Approval Loading Screen that informs them they are being admitted as a speaker. This smooth transition reduces any potential delay or confusion, ensuring a cohesive experience. Finally, participants are taken to the Active Speaker View, allowing them to interact freely, contributing to the discussion or presentation.
The carefully designed participant flow in Convay Webinar not only keeps large events organized but also empowers attendees to interact effectively without disrupting the session's structure. By integrating real-time feedback and clear status updates, the participant experience is both user-friendly and intuitively responsive.
Participant Viewing Mode – Displays the default view for participants in a webinar. They can see other participants but cannot interact directly unless granted permission.
Request to Talk Button – Highlights the option for participants to request permission to speak, initiating interaction with the host.
Request Sent Confirmation – Shows the confirmation that a participant's request to speak has been successfully sent to the host.
Request Approval Loading Screen – Displays a loading screen with a message indicating the host has granted the request, preparing the participant to join the discussion.
Active Speaker View – Displays the view after the participant’s request has been accepted, allowing them to participate actively.
Backend Optimization for Large Events
One of the primary challenges with the Convay Webinar feature was ensuring seamless performance for events with up to 5,000 participants. Given the high volume, optimizing the backend was critical to avoid lag or disruptions. We designed the system to separate host and participant interactions effectively. The backend distinguishes between two types of meetings: one for hosts and presenters, where all controls are accessible, and a second for general participants, where they can view and listen but cannot interact without permission.
This segmentation allows the system to allocate resources more efficiently. When a participant requests to speak, the backend temporarily shifts them to the host meeting space once approved, allowing for smooth interaction with minimal delay. This architecture reduces strain on the servers by keeping interactions for the majority of users (general attendees) lightweight, reserving intensive processing for hosts and permitted speakers only. This approach has been instrumental in maintaining system stability and responsiveness, even during large-scale events.
Challenges and Solutions
Throughout the development of Convay Webinar, we encountered several unique challenges, particularly in balancing functionality with simplicity. One significant challenge was designing an intuitive UI for host controls that could handle a large number of participants without feeling cluttered. To solve this, we created segmented tabs within the attendee list, allowing hosts to easily navigate between "All Attendees," "Requests to Talk," and "Allowed to Talk." This categorization helps hosts manage permissions effectively, focusing only on relevant lists when moderating a large crowd.
Another challenge was ensuring a smooth transition for participants from the general audience to speaker mode. The solution lay in backend optimization—when a participant's request to speak is granted, they seamlessly transition to the host’s view without perceivable lag. This invisible transition was essential to maintaining a polished experience, where participants could join the conversation without disrupting the flow of the event. Additionally, designing real-time notifications for request statuses (sent, accepted, pending) kept users informed and engaged without overwhelming them.
Takeaways
Working on Convay Webinar was a valuable learning experience, particularly in designing for scalability and complex user interactions. One key takeaway was the importance of backend optimization in managing high-volume events, which allowed us to deliver a smooth user experience even with thousands of participants. Designing the system to handle permissions dynamically—distinguishing between general attendees and hosts—proved essential for keeping operations efficient and responsive.
Another lesson learned was the value of a well-organized UI for complex tasks. By segmenting controls and categorizing attendee lists, we created a cleaner, more manageable interface for hosts, which significantly improved usability during live events. This project also deepened my understanding of balancing technical constraints with user-friendly design, equipping me with skills to tackle similar large-scale challenges in the future.