Microsoft announces completely re-designed, responsive web experience for OneDrive.
- After several rounds of iteration, we landed on a 4px grid, which allowed for enough flexibility in layout, while maintaining the visual density and stability we wanted the experience to achieve. We also wanted to bring a measure of efficiency to our studio processes by creating a single grid that could work across both web and native layouts. The 4px solution accomplished both goals.
- In parallel, we did an extensive audit of the class of device and its relationship to usage. This helped us better target the ideal number of responsive breakpoints for our experience. We landed on six, and from that developed our responsive grid. It brings a sense of order and structure to our experiences while also being flexible enough to enable a more useful web experience on the go.
- After the grid, the color palette came next. Our brand color is a well-established #234fa2, so we started there and worked up a full set of complimentary tonal grays with a few accents. We did a deep accessibility pass, made a few adjustments, and arrived at the color palette you see in the product today. It’s a well-balanced set of colors, that brings a refreshing, creative energy to the OneDrive UI.
Read more about it here.