Company: Skype
Contact: Claudius Henrichs (Community Manager)
Community: Skype Community
Lithy category: Community Design of the Year
Skype is for doing things together, whenever you’re apart. Skype’s text, voice and video make it simple to share experiences with the people that matter to you, wherever they are.
With Skype, you can share a story, celebrate a birthday, learn a language, hold a meeting, work with colleagues – just about anything you need to do together every day. You can use Skype on whatever works best for you - on your phone or computer or a TV with Skype on it. It is free to start using Skype - to speak, see and instant message other people on Skype for example.
Our community goals
Since 2011 the Skype Community is the place for customers and employees to meet and exchange and learn about everything Skype. With topics ranging from technical support through ideation all the way to tips and tricks it’s the place to become a Skype expert.
Our product organization is using community insight to obtain customer lead steering for the next iterations of product and features. A vibrant global community covering 11 languages is crucial to ensure that we understand and prioritize what is driving customers, from the newly registered all the way to the 10+ year superfan.
At the same time Skype Community gives customers the opportunity to learn about the people at Skype: What made us come up with a certain feature, how we built it and how we operate to deliver against our mission to be customer obsessed.
Our goal for this year was to deliver all of this on an awesome mobile and more personal community experience.
Our unique design elements
Over the course of the last 12 months we have honed in on our strategy to everywhere put our community members and their content first. At the same time since our last redesign in 2014 we have been working closer with our design team to ensure the Skype Community reflects the Skype brand.
Skype iconography and design elements
You feel right at home at the Skype Community thanks to the familiar buttons, colors and layout elements. Particularly the orange dot as an indicator for unread conversations is what you will find across the community UI: From your personal notifications down to topic level:
Skype avatars and emoticons
Everyone loves the Skype emoticons which is why we’ve replaced the Lithium profile avatar collections with a Skype one (which proved to be quite challenging with 3M+ registered accounts already having selected a Lithium avatar):
...and we did the same for the editor emoticons:
Mobile optimized– Scroll to top & Browse menu
Our responsive design doesn’t only reshuffle widget placements on smaller screen sizes, but we have also put some thought on how you quickly browse within long topics and the community using a dynamic scroll to top and a browse menu: All conveniently placed in reach for your right thumb:
Skype Hovercards
Hovercards are getting common at Lithium communities, but we’ve taken them a bit further with small tweaks that visually invite discovering them via subtle avatar zooms when moving the mouse over it. And of course they follow the Skype branding and give a nice showcase for the badge icons:
How we executed our community design
First phase: Inventory & spring cleaning
We started with an inventory of all our components – stock and custom ones – per each page and applied a strict triaging following out “members and content first” rule to determine which of them were to be kept. According to that we built up the page layouts.
Second phase: Airbrush & Spraypaint
We started off from the plain white Lithium responsive base skin and had the developer team apply all the basic styling elements according to the Skype style guideline: Font families and sizes, buttons, boxes, colors. So we weren’t actually working off pixel perfect designs for each page, but invited our design team on to our stage server and have them identify the necessary detailed tweaks (“30px top margins above all panels!”). As an outcome to this within 2 weeks we had a solid basic styling across all primary page layouts.
Third phase: Review, Optimize, Rinse & repeat
We had then entered the phase of optimizing the interactions on actual devices, so we focused on model devices for each category – mobile, tablet, large screen – and gave the design the necessary fine tune in the following 3-4 weeks. We involved our super fans here to ensure that the new site worked for their everyday flow as much as for the casual visitor. And honestly: We never exited this phase and versioning wise have already reached “Responsive 1.6”
Our results
A few weeks in the new responsive design has shown the following impact:
- Mobile registration 23% up – across all device sizes up 12%
- 84% more images uploaded thanks to the new media experience
- 19% referrer traffic increase
- Subscriptions up 57%
- Expected 400-500K unique visitor increase monthly thanks to new responsive community unlocking option for in-client community links on mobile
