FreshVoice iPhone

FreshVoice is a enterprise video conferencing solution developed by Anet. I was tasked to redesign the iPhone application using existing functionality from their desktop product. The challenge here was designing a enitrely new user interface that followed recommended iOS guidelines, while still providing a consistent user experience in both English & Japanese.

Understanding The Problem

FreshVoice for iPhone was developed out of necessity and was quickly developed by a programmer. No thought had actually gone into the actual branding of the application or the overall UX/UI design. Hence, I was tasked to redesign the iPhone application from scratch.

Design Process

All of the functionality had been decided, so it was a case of designing a user experience that was intuitive, quick and simple to use both in portrait and landscape views.

New Brand Identity

I was tasked by creating a new brand identity from the CEO. He wanted to expand to international markets and have a logo and color scheme that resonated with Western style software companies.



Login & Authentication

FreshVoice users are setup with a secure connection and require two stage authentication to reach the application.



Server Authentication


User Authentication

List & Branch View

FreshVoice enterprise users have preloaded directories of contacts to their company. From these contacts they are further segmented into individual and branch users.



Individual Contacts


Branch Contacts


Creating Multi-Partipant Calls & Groups

Group and multi-participant calls is the most widely used feature for FreshVoice. They are able to facilitate calls with up to 16 guests with minimal latency and video quality. It was imperative to enable iPhone users a simple way to highlight contacts in both the individual and branch views. I did this using touch and swipe gestures.


Invision Prototype ~ Individual Calls

https://invis.io/7B718LJ2M

Invision Prototype ~ Group Calls

https://invis.io/7B718LJ2M

Calling States

There are multiple calling states for both individual and group calls, each had to be designed independently. I used gradient colors to highlight individual (green) and group (blue) calls.



Calling multiple people


Incoming individual call



Incoming two-way call



Incoming multiple call (swipe gesture)



Outgoing Group call to multiple people


Incoming Group call with multiple people


Incoming Group call with multiple people (swipe gesture)

In Call Video Grid & Paging

Once in a call, there is advanced functionality to order how the video grid is displayed depending on how many participants are present.



One-to-one call


3-way call



9-way call



16-way call



Video Grid Settings


In call navigation differed once the user turned their screen horizontally. To preserve space and focus attention on video call itself I moved menu items into two buttons in each corner. Once opened the users could navigate to similar screens.



Horizontal 4-way call ~ cornerd navigation


16 participant call with page navigation



Primary menu navigation opened



Call details menu open



Call details more options open


Interaction Design & Animation

Animating the corner navigation menus with Principle for Mac allowed me to finely tune timings and easing curves.

In Call ~ Advanced Functionality

While in a call, users have options for various interactions including: text chat, document sharing, in-call settings and connection status. The document sharing is compatible with all known file formats so special attention had to be taken into account when designing for images, presentations and video. There is also an advanced feature for call “chairmans” to synchronize documents to same pages, video cuepoints and image zooms.



Text chat


PDF Document



Synchronize document feature



Powerpoint Document



Image

UI Comparisons ~ Old vs. New

Comparisons between old and new design



Login Screen ~ Comparison



Contacts List ~ Comparison



In Call ~ Comparison


Results ~ Beta Testing

The redesign of the application is currently in Beta testing with internal team members. However, recent results show that users spend 40% longer in the app.