Portfolio: Microsoft projects

Martin McCann Microsoft Virtual Academy User Interface responsive
Martin McCann Microsoft Virtual Academy User Interface responsive
Martin McCann Microsoft Virtual Academy User Interface responsive

The Project: Microsoft Virtual Academy (MVA)

Purpose: Need for a site to promote and distribute knowledge tools published by Microsoft to create and manage web based production.
Goal: Create the User Interface and template structure for all pages before production.
Challenges: Produce a responsive design that would allow for ease of use across all devices and meet strict brand style guide. Production was handled by another firm so the Photoshop documents produced needed to be well organized and redlines structured so that it would be easy for the production team to assess the necessary elements that needed scripting and separate out elements such as text.
Production: UI, image development, redlines for production
Tools: Photoshop – Code done by others.

Martin McCann Microsoft Virtual Academy Banner 1 Million Customer
Martin McCann Microsoft Virtual Academy Banner 1 Million Customer
Martin McCann Microsoft Virtual Academy Banner 2 Million Customer English
Martin McCann Microsoft Virtual Academy Banner 2 Million Customer French
Martin McCann Microsoft Virtual Academy Banner 2 Million Customer German
Martin McCann Microsoft Virtual Academy Banner 2 Million Customer Spanish
Martin McCann Microsoft Virtual Academy Banner 2 Million Customer Facebook
Martin McCann Microsoft Virtual Academy Banner 2 Million Customer original
Martin McCann Microsoft Virtual Academy Banner 2 Million Customer edit
Martin McCann Microsoft Virtual Academy Banner 2 Million Customer

Purpose: Need to promote the customer growth on MVA
Goal: Create collateral, both electronic and printed, that would invoke the excitement of being a MVA user. T-shirts and balloons with branding where also to be included.
Challenges: Finding appropriate photography that would meet branding guidelines. Producing imagery with which the worldwide audience could identify.
Production: Image development, print-ready files
Tools: Digital camera, Photoshop, Adobe Illustrator, scanner

Martin McCann Microsoft Virtual Academy special page User Interface
Martin McCann Microsoft Virtual Academy special page User Interface
Martin McCann Microsoft Virtual Academy special page User Interface
Martin McCann Microsoft Virtual Academy special page User Interface redline
Martin McCann Microsoft Virtual Academy special page User Interface redline

Purpose: Need for single page templates to promote and distribute specific knowledge tools published by Microsoft to create and manage web based production.
Goal: Create the User Interface and template structure for all pages before production.
Challenges: Produce a template design that would allow for another to update content while maintaining a strict brand style guide. Production was handled by another firm so the Photoshop documents produced needed to be well organized and redlines structured so that it would be easy for the production team to assess the necessary elements that needed scripting and separate out elements such as text.
Production: UI, image development, redlines for production
Tools: Photoshop – Code done by others.

 

The Project: Microsoft Flight

Martin McCann Microsoft Flight User Interface
Martin McCann Microsoft Flight User Interface
Martin McCann Microsoft Flight User Interface
Martin McCann Microsoft Flight User Interface
Martin McCann Microsoft Flight User Interface
Martin McCann Microsoft Flight User Interface
Martin McCann Microsoft Flight User Interface
Martin McCann Microsoft Flight User Interface
Martin McCann Microsoft Flight User Interface
Martin McCann Microsoft Flight User Interface
Martin McCann Microsoft Flight User Interface
Martin McCann Microsoft Flight User Interface

Purpose: Need for a site to promote and distribute a free version of an on-line flight simulator.
Goal: Create the User Interface and template structure for all pages before production.
Challenges: Produce a design that would imply the light, airy quality of flying and be modular in functionality. Use of content panels were required due to the stagnate background tableau. A translucence style was created and used on all the text panels and support imagery.
Since this game is internationally distributed there was need for Localization. Problems related to this arose due to the structure of the left Call to Action panels. Thus I created each CTA panel individually. On the main page CTA, a separate graphic for each language translation was produced.
Production was handled by a another firm so the Photoshop documents produced needed to be well organized and structured so that it would be easy for the production artist to assess the necessary image elements such as “hover” and “current” states and separate out elements such as text.
The production team originally used the PNG file type for the full page graphics but that proved too heavy a file so JPEGs were produced to minimize load time.
Production: UI, image development
Tools: Photoshop – Code done by others.
Site has been retired

The Project: Microsoft Dynamics CRM Partner Business Systems

Microsoft PBS UI - Martin McCann portfolioPurpose: Need for a site to promote the use of and sell Microsoft PBS to MS partners.
Goal: Create the User Interface for all pages based off a provided wireframe of the main page.
Challenges: Produce a design that would organically lead the user through the site, from the introduction (What), through the sell (Why) and to the sale (How). The (3) panel idea was presented in the wireframe and was to be the bases of all the subsequent pages. This lead to maintaining the use of a panel as the main image element throughout the site.
Since the client wanted the user to peruse the site in a prescribed order then a traditional main navigation scheme would not be needed. Thus the navigation scheme that was developed consisting of just the (4): Home, What, Why, How.
The production was handled by a another firm so the Photoshop documents produced needed to be well organized and structured so that it would be easy for the production artist to assess the necessary image elements such as “hover” and “current” states and separate out elements such as text.
Production: UI, image development
Tools: Photoshop – Code done by others.
Site has been retired