Google last night released Hangouts 4.0 to its iOS users (the Android update is yet to be released). The rollout steeps the app’s UI deeper into the realm of Material Design, however the folks at Google have gotten a number of basic design principals wrong.
Is Google’s Love Affair with Unnecessary Clicks Finally Abating?
The popularity of the app is driven primarily thanks to its interconnectivity with Gmail as well as its desktop friendly offering which allows colleagues to connect seamlessly (and also for quick private messages to be received and responded to in a professional, non-intrusive manner).
However, even on the desktop version Google have added in a ridiculous number of steps. For example, if a user wants to send an image – instead of dragging and dropping the picture on to the chat window to send, users need to click on an image icon in the chat window which opens up a large fresh dialog box where they can then drag and drop the image to (if it hasn’t been covered by the dialog box). After the image loads the user must then click another button which sends the image on its way! (Amusingly, if you do drag and drop an image in to the chat window, Google Chrome opens up with the image in a new tab).
Initially an Android user, I got fed up with how many clicks any task would take and grew jealous of the seamless interactions my iOS counterparts were enjoying and switched teams a few years back. The world of Android came crashing back to me recently though when I began using their Hangouts app. Most notably when a user clicks a youtube link and, rather than open up the video in my Youtube app, a menu would appear with three options: to use the Youtube app, to go to the web address on the Safari app or, strangely, to download Chrome (and I suspect open the youtube video there). I am happy to report that this no longer happens in Hangouts 4.0 and instead users are brought directly to the Youtube app, similarly with web links if the user does not have Chrome, the link opens straight into Safari.
Google are finally putting user experience above pushing their own products, and in this regard at least, it’s a win for users.
The Colour Scheme
However, while they have reduced silly disruptions, Google have made some bizarre design decisions which fly in the face of convention and basic design principals. Most obvious is the reversal of the messaging colour scheme. Instead of outgoing messages being green with white text and incoming messages having a white background with black text – the reverse is now true.
Reversing the colours is confusing for anybody who is used to this app, (not to mention all of the competitors’ apps). Convention states that the white backgrounded message is the one you are intended to read and darker (sent) messages are essentially for reference only. This is not only convention, but follows design principals – using dark colours with white text is great to let headlines jump out at users, but is in large chunks is actually quite difficult to focus on and read. This is because the light that hits each character reflects and scatters into the others making the shapes harder to perceive and ultimately affecting the readability of the messages.
The Floating Action Button (FAB)
The FAB is a highly controversial staple of Material Design, in the case of Hangouts it doesn’t really cover or adversely affect any of the UI elements in its path. However, the FAB is designed to highlight the primary Click-to-Action (CTA), in other words it is Google’s answer to the 80-20 rule (20% of buttons on apps/sites are clicked 80% of the time). In the two FAB use cases in Hangouts 4.0 the FAB fails it’s users:
- On the main screen the FAB floats over your recent chats with the option of starting a new chat, however, most interactions will be with people you are already in active conversations with on the app, and by popping this button over all of those conversation links, Google are actually relegating the most regularly selected options.
- In the messaging screens the FAB serves as the send button once you have entered text into the field, but as you will see in the above image, the button is located actually quite far away from the keyboard. In my experience, I keep hitting the location button instead of the send button because on all other apps (including Hangouts 3.3) that’s roughly where the send button was located. This change leads to a frustrating User Experience!
Lack of Feedback
Google have also done away with the interaction which let you know that your message had sent, or was still in the process of sending (your image with a green line spinning around it until it turned solid green to signal the message was sent). A subtle ‘now’ appears to show the message is delivered in the new update. This is possibly due to the speed improvements Google announced with the launch of 4.0 – it’s great that they feel they don’t need to draw attention to lagging message, but with wifi and mobile web still not as reliable as one would hope, it was a nice addition to the Hangouts platform which I, for one, will miss.