As we were entering the second half of 2014 it was clear AVChat’s looks were up for renewal. Many clients had already referred to its looks as outdated and wanted a more modern look but we also felt a strong need to bring its design in line with today’s best practices.
Thus for the latest build of AVChat we’ve made the biggest redesign since the initial release of AVChat 3.0. We’ve redesigned it with a simple philosophy in mind: everything needs to be clear, simple and consistent. We think we’ve achieved that:
Hand in hand with changing the design came adopting the ability to have themes. I am proud to announce that AVChat now supports themes and, to show off the feature, it ships with 2 themes: dark and light (standard).
Another area of focus was adopting sequence based version numbers for AVChat builds. If until now, we referred to each new version by its build number (the last AVChat release was build 3396), from now on, we will primarily use sequence based version numbers. To symbolise the big steps that AVChat has taken from its 3.0 release back in 2009 we will name today’s build as AVChat 3.5 (build 3517).
That said let’s get started in presenting the new design and UI.
The Login Screen
Keeping in mind the approach of clearer elements and consistency, we’ve created the following look for the Login Screen:
We have removed the gender radio buttons and replaced them with a drop down list. This will make it easier to pack many gender options in a tiny space. Some clients replace the gender setting with, for example, a location setting with many options. This design choice will make their lives a lot easier. Genders will continue to have icons assigned to them, but they will only be visible in the users list and in the status bar. Genders now also have colours associated with them but more on that later.
Here’s a view of the Sign in or Register area:
The Status Bar
After you enter the chat, you will notice the new status bar. It now has the same width as the chat. The buttons that you find here have affect the entire chat and we wanted to convey that.
Also depending on the gender selected the new thumbnail will have a different outline color (shows up on mouse over) that will correspond with the outline color set in genders.xml, for more details view the documentation.
Here’s how the status bar looks:
The Users List
The users list got quite an upgrade. Apart from the design change we have removed the users list side menu (sorting and type of users to show) and we introduced 3 tabs, one for each type of user: all users in the room, users watching me, blocked users.
The default sorting mechanism (alphanumeric, cams on top, time online and genders) can still be set via the defaultSort setting in avc_settings.xml .
Here’s a view of the complete users list:
The user item got completely new icons and the thumbnails have been made circular giving the whole thing a much cleaner and modern look. On mouse over a small colored left line will be shown. The color corresponds with the color associated with that users gender ( the same way the outline in the avatar in the status bar does):
The User Side Menu
Keeping the overall trend of the design the side menu has also been redesigned accordingly, new flat icons, better spacing between elements, simpler form:
The Webcam Windows
The allow access privacy modal has been changed in order to give more information:
For the actual webcam windows, both for the broadcaster and the viewers, we have eliminated the borders and as a result the the video has a bigger surface area and feels more integrated with the interface:
The Textchat Area
The two major changes that have been made to the textchat area apart from the color changes and border removals, are the new look of the tab bar and the lower toolbar area with the text input.
The tab bar may feel familiar because you have already seen it in the login screen 🙂
What you don’t know is that we have also changed the notifications styling:
Let’s focus on the lower part of the text chat area. Here you can see that some of the buttons were removed:
The Send File Window
The send file window has been updated to reflect the new design but has some new functionality: the user can directly see what types of files are accepted for upload and the maximum upload size that is permitted:
Themes, themes, themes
Along the new design changes we are proud to announce the introduction of AVChat themes.
AVChat now ships with two default themes: light and dark. These can be found in the new themes folder. Each theme has a separate style.xml file. Here’s how they look in comparison:
If you wish to know how to change between themes or how to make your own custom theme you can read the AVChat themes documentation.
Check out The New Design in the AVChat 3.5 demos
Our AVChat demos have been updated with AVChat 3.5 and you can check them out at http://avchat.net/demos/ .
How To Download And Upgrade
You can download this new build of AVChat from your private client area. You can login at https://nusofthq.com/c/ .
Steps to upgrade old AVChat copies:
- make a backup of your current AVChat installation folder
- overwrite all old client side files (for the settings file and the language files, you can just add the new settings and the new translations to your current settings and language files.)
- make a backup of your media server files
- overwrite the media server files and restart the media server
- clear your browser cache and access AVChat 3.5
If you have issues with it after upgrading contact AVChat’s tech support through your client area or send us an email at support
If you want us to upgrade your existing AVChat installation to 3.5 for you can purchase our Update AVChat Service ($59) from http://avchat.net/services#update. If you’re looking for a clean install you can just purchase the Pro AVChat Install Service ($29) from http://avchat.net/services#installavchat. Once you make the purchase just contact AVChat’s tech support through your client area or send us an email at support
Small Update AVChat 3.5.1 Released
This update fixes a couple of small issues related to the newly added themes.