Developing an Open Source Icon System at Microsoft

Developing an Open Source Icon System at Microsoft medium.com2 weeks ago in #Design Love31

A Q A between our community and design leads about our new Fluent icons Icons transcend languages. They’re signposts that light the way for an easy, delightful user experience. If an icon’s direction or message lacks clarity, it becomes eye candy at best and a distraction at worst. So, when the team began the feat of creating 500 Fluent Design System icons to work across Microsoft products, the web, Android OS, and Apple iOS, they knew they had to get it right. But what exactly goes into “getting it right”? And how exactly does one start designing mobile icons for a company that already has desktop ones? And why does it take so darn long to design and implement anything across the product ecosystem? These are just some of the tough topics inquiring minds asked us on Instagram, Twitter and Facebook. Transformation into the new icons. Senior Product Designer Joe Woodward and Senior Designer Jason Custer (with cameos from Principal Designer Janet Longhurst), two of the leads behind the Fluent icon initiative, answer these questions in the Q&A below. We hope you find it helpful and, as always, we’d love to hear your thoughts on the icons in the comments below. Questions from customers and answers from designers have been lightly edited for clarity and concision. @hraikai: Why does it take so long for a design system to be applied across a company? Jason: Imagine the system is a train. And as a train, you have to get people on and off, but you also want to get them to their destination. We don’t want to go so slow that we fall behind and teams are leaving the design system, but we don’t want to get to a place too early when people haven’t caught up to the code components yet. It’s the fine balance of pushing forward and getting teams on board without losing them. And also showing the value too, that’s the piece that’s hard. When a team is used to going at their own speed, and then you ask them to join the effort, it can be hard for them to see the value of joining the effort if that speed isn’t the same as theirs. Joe: So, you have the whole effort of actually creating the icons, the design language, or whatever it is. And then there’s this whole other part of convincing different teams to adopt the new design system. At a company this big, if you design a whole set of icons and come in at the last minute and say, “Hey, use this set,“ I think people will feel less likely to be OK with that. You really need to bring them along the journey so they can give feedback and be part of it. It also helps if you have a couple of teams that have already adopted it so others can see what everything looks like in practice. Icons in context. Jason: You’re totally right, the proof is in the pudding. There’s also the challenge of teams all having their own priorities to meet, like fixing certain bugs or releasing new features. They already have their schedule set, so adding these kinds of polish or alignment efforts can be difficult. Janet: It was also crucial for all the tooling structures and naming systems to make sense to everyone across all of the design teams.  » Read More

Like to keep reading?

This article first appeared on If you'd like to keep reading, follow the white rabbit.

View Full Article

Leave a Reply