From day to day I was utilized in many different capacities. Here are some examples.
Overall page style
I joined the team early in the design phase of the second Milestone. My early focus was on polishing that design. The design was based around the Office and Vista styles. I wanted to retain that feeling without blatantly stealing the UI. I created a more cohesive color palette that I could transition from the early design to the new design.
Header
I designed the UI and interaction for the main navigation active, inactive and hover states, which also correspond visually with the secondary navigation. The header background is vertically scalable to accommodate different height logos.
Module colors
The module colors indicate what type of content it should contain. Grey is for User Assistance and Help items. Gold is for Alerts and OOBE tasks. Blue is the general content color.
Icons
Icons can be a very useful way of getting a message across quickly, but improperly used they can be a distraction. Having spent a year with the Windows team working on icons for Vista I put that experience to use. Without the icons the pages are very bare. When an existing icon could not be used I created something that fit the need.
Developed HTML/ASPX/CSS prototype demo site
In the course of designing screens in Photoshop, the idea came about to create a "demo" website from the screens we were creating. This would serve as a tool for prototyping how the site would interact without using any Developer resources. We built out the first version using PNGs and Image map links. This tool was utilized in early usability testing allowing us to get an earlier warning if the interaction was making sense. The demo site has been widely circulated among the CCS team and beyond. The first version proved so useful that we took version 2 to the next level. We redesigned the entire site using ASPX and CSS extensively throughout. Using ASPX allowed us the use If/Else tags to make page creation extremely easier. It improved it so much we quit designing in Photoshop and went from conceptual sketches right to the demo site allowing for much quicker iteration.
Prototype and Visual Design for Sign In service client application
The Sign In client application serves as a launching point for the different applications associated with Microsoft Online as well as an easy way for the Information Worker to sign in to all the applications at the same entry point. I designed some early designs that were far beyond the scope of what we were able to do for this milestone, but it gave us some idea of where the application could go. Once we scaled back to what we could do I was given the go ahead to work directly with the developer on the UI for it. I had some beta experience using Expression Blend and we were all excited to see what we could quickly do with it. I created some UI elements in Expression Design and exported them to XAML to import into Blend. I took what the developer had and integrated my UI into it. He then took that and worked it some more. It only took us a few days to completely upgrade the UI.
