Live Chat in Skype
Adding a feature to Skype mobile
Brief: Add a Live chat feature during Skype video calling
Team: Going solo!
Tools: Sketch, Adobe XD, Principle, Craft+Invision, Paper & pen
Deliverables: User research and persona, wireframes, hi-fidelity interactive prototypes, usability testing
Background
Since its launch in 2003, Skype has held an important place in the heart of the video calling audience. However, with stiff competition from Whatsapp, Duo, Zoom, Skype has gotten left behind.
For this UI Project at Ironhack Amsterdam, we were given a “blind date”- randomly selected brand and feature to implement.
My feature was:
Skype: Synchronised viewing mode
Well, that was hardly new to video calling! Time for some user research and discovery.
Research
I started with some primary research on how our audience uses video calling.
Our user:
- 22–40 years old
- Uses video calling every week
- Uses group calling every month
- Likes it because you can see the other person(s), not just audio
I also interviewed some users to get a better understanding of their needs- what feature do they want?
“Handshakes and virtual hugs. Kisses too.”
“Reactions on group conferences, where you can input live.”
A competitive analysis of the major players in the market helped to gauge the feature offerings and where Skype stands.
Using this research as a springboard, I brainstormed among my peers and came up with two iterations of the feature: for Skype personal and Skype for Business.
Skype (personal) Implementation
Will uses Skype to stay in touch with his family, who live on a different continent. He also makes use of Skype to stay in touch with his partner and son, while traveling for work.
How can Will share his emotions better on Skype?
User Flow and Paper prototyping
I made a task-focused user flow and paper prototype and tested it out among the users.
Reactions were positive, keywords being “intuitive, fun”.
HI-FIDELITY PROTOTYPING
Here is a short gif of the implementation of the above feature, in high fidelity.
Skype for Business Implementation
Skype for Business (or Microsoft Teams, as it will become in Jun 2021) is where Microsoft has put in the most efforts- combining instant messaging, video conferencing, calling, and document collaboration with market leading group calling (upto 250 participants).
However, strangely enough, video calling and chatting are not synchronised in Skype. This is where my feature fits in.
I began with sketching out a user flow and using it to build and test a paper prototype.
User Flow and Paper Prototyping
Users can enter the chat window without exiting the video screen and leave messages.
- The message would be temporarily displayed in real-time on the video screen.
- Each chat message would be saved with a timestamped image of the video screen at that moment, anchoring the message to the moment.
- Users can view all the messages in a separate window and email them for documentation.
Usability Testing
The first test was on how the users preferred their comments to be displayed, during the call.
- 71% preferred option 2: comment below video screen
- Users found the “leave comment” icon intuitive and accessible.
- No other changes were made to the current Skype UI, to minimise disruption in user experience.
Users were also given two tasks:
- Leave a comment during the video call.
- View and share all the comments.
HI-FIDELITY PROTOTYPE
A short video (45 secs) on the interactive hi-fidelity prototype.
The full interactive prototype can be viewed here.
Learnings
In some ways, this project was a test in patience. Skype is a complex, legacy system and it was hard to resist scope creep- making/adding changes outside the range of the project.
It was also a good project to learn about making design systems, something that will come in handy in future group projects. Now if only there was a way to resist obsessive micro nudging!