Navigation Menu+

SeriaWebcast

Posted on August 20, 2013 in UI Design | 0 comments

About the Project:

Seria Webcast is a no-hassle live video streaming solution that allows you to stream live video from anywhere, to anywhere. Not only can you securely stream live video, but you can also view powerpoint presentations simultaneously, share files with viewers and chat live with viewers. After the live stream completes videos are automatically available as video-on-demand and viewing statistics are available to administrators. 

The goal of the project was to take an outdated, difficult to understand user-interface and not just "make it prettier" but to use design to create an intuitive, easy-to-use software interface. We accomplished this goal by designing a new user dashboard with quick links, updating the create a webcast wizard and establishing an overall content hierarchy. 

 

My Role:

I was the sole designer responsible for the re-branding and re-designing the user interface for Seria Webcast. I concepted, wireframed and designed the user experience of every interaction within the software, while working closely with a frontend and backend developer.

BEFORE

The backend UI during a live webcast.

AFTER

The re-designed UI during a live webcast.

The main dashboard upon login. This shows your upcoming webcasts, any product updates and a list of recently edited webcasts.

The main dashboard upon login. This shows your upcoming webcasts, any product updates and a list of recently edited webcasts.

This is the first step in creating a new webcast. You add all of the webcast details on the left and then the code snippet to add to your website appears on the right.

This is the first step in creating a new webcast. You add all of the webcast details on the left and then the code snippet to add to your website appears on the right.

This is the webcast in full swing. You can see the slides you have uploaded on the left and the live video on the top right. There is a chat box to communicate with viewers in the lower right.

This is the webcast in full swing. You can see the slides you have uploaded on the left and the live video on the top right. There is a chat box to communicate with viewers in the lower right.

When the webcast is complete you receive a report with some statistics and are able to email the report to others.

When the webcast is complete you receive a report with some statistics and are able to email the report to others.

Admins are able to edit the webcast afterwords and add in new chapters and links.

Admins are able to edit the webcast afterwords and add in new chapters and links.

Admins may also upload new videos and insert new slides to match up to different intervals.

Admins may also upload new videos and insert new slides to match up to different intervals.

This is the front end player view that the audience sees showing the live video, slideshow and chat function.

This is the front end player view that the audience sees showing the live video, slideshow and chat function.

This is the front end player view that the audience sees showing just the video and the chat function.

This is the front end player view that the audience sees showing just the video and the chat function.

This is the front end player view that the audience sees showing only a fullscreen video.

This is the front end player view that the audience sees showing only a fullscreen video.