microsoft / msn


Designs seen by over 170million people each month


Wireframing and UX
Each and every project started with a wireframe. The wireframes were low-fidelity, but highly important to outline where the content areas would sit within MSN's grid system.
Component Design
Each component on the page was created individually, designed within Microsoft's Human Interface Guidlines. The component was created within Microsoft's 12 column grid system, which created pixel-perfect layouts.


Pixel-perfect redlines
Because I was part of a large international organisation, it was important to provide redline guides for the developers. This showed developers the exact pixel sizing and spacing requirements within the grid system and made it completely clear we expected pixel-perfect development.
Grid layout and clean styling
MSN is a notoriously busy content site, with many different portals and heaps of text. I helped recreate a layout that matched the new Windows 8 'metro' styling, but housed the extensive content in an easy-on-the-eye structure. The site always followed a 12 column grid structure, creating perfect gutters and element sizing.


Standout Moments
- Complete MSN redesign
- Work commended by Bill Gates internally
- Creation of UI components to be used in 20+ languages
- Creation of FashionWeek + LivePlay branded page
ameego restaurant scheduling
