Portfolio


Microsoft Surface 2.0 Designer Training Course Graphics and Skin

Worked closely with Microsoft Designers and Developers on the Surface team to create e- learning training around the interface and design best practices for the Microsoft Surface 2.0 SDK and Training. Additionally, I worked with the Surface team to design a metro styled skin based on the Surface 2.0 brand. Silverlight 4.0, Surface 2.0 SDK TAP, Adobe Illustrator, Luminosity Studio, Visual Studio 2010, Expression Blend

More ⇨

~Websites / Interactive~
Microsoft & HP Data Appliance Posters

Created a hybrid brand template based on both HP and Microsoft corporate brands. Designed a series of posters, banners and datasheets showcasing the four appliance servers co-developed by Microsoft and HP. Worked closely with the content authors to assure design would work at all sizes and form factors.

More ⇨

~Print / Poster / Datasheet~
Visual Studio Team Foundation Service Preview //build attendees

The 2nd design of the Visual Studio TFS "Golden Ticket" series. Included with the Windows 8 Developer Tablet given to each attendee of the //build conference hosted by Microsoft in 2011. The Visual Studio logo was incorporated into a popup that opens to reveal a 3D version and a unique code to unlock the service.

More ⇨

~Print / Promotional~
Microsoft MMPC - Spotting the Rogue Graphics and Animation

Interface, animation and graphics. Created in Silverlight 1.0. A full suite of custom icons were designed along with a fully interactive video player.

More ⇨

~Videos / Interactive~
Microsoft Customer Evidence Showcase - prototype Silverlight Web Experience

The Customer Evidence Showcase is an extension of the existing Microsoft UX Kit. The Silverlight based site was redesigned to improve overall User Experience and assist in finding related content. The content was stored on Azure cloud storage and managed using a 3rd party Content Management Tool

More ⇨

~Websites / Interactive / CMS~
Microsoft SQL Server 2008 Poster

Technical overview poster for SQL Server 2008. Features the 5 primary offerings as color coded regions positioned to show the relationship between each section. Worked with Each team at Microsoft to establish the overall content and visual representation of each offering. Developed custom graphical assets, icons and layouts. Focused on technical accuracy, useability and optimization across multiple form factors.

More ⇨

~Print / Poster / Illustration~
Visual Studio 11 Developer Preview Product Guide //build

Print Design and layout for the Visual Studio 2011 Preview Product guide shown at the Microsoft Build event in 2011.

More ⇨

~Print~
Microsoft SAAS Interactive Poster Website

Created a data driven version of an existing poster that features real time XML based localization including support for R-L character sets. Custom controls designed to expand and collapse to adjust for the difference in text length. Similar in concept to DeepZoom technology in general interface but is driven by XAML vector content to provide data binding.

More ⇨

~Websites / Poster / Interactive~
.NET Field Demo - Woodgrove

UI/UX Design for the Microsoft .NET Field Demo

More ⇨

~Websites / Application / Interactive~
Zune Model Comparison Infographic

Infographic inspired poster design showcasing the form factors and features of each Zune device. Researched each device and developed custom illustrations to accurately illustrated the actual hardware including the internal hardware configuration.

More ⇨

~Poster / Illustration~
Visual Studio ALM - Technical Whitepapers

Print production for 8 new Application Lifecycle Management hero scenario white papers. Focused on reader experience when choosing paper stock, binding, form factor and layout. Created a series of icons and info table highlighting the product pillars. Many of these graphics became standard and used in multiple places.

More ⇨

~Print / Datasheet / Book~
Visual Studio ALM Compete Book- Design and Graphics

Five Application Lifecycle Management competitive discussion guides designed intoa booklet for internal Microsoft field salespeople. In addition to the competitive discussion guides, the booklet includes a table of contents, cover and section introductions, and an introduction (3-5 pages) written by Microsoft.

More ⇨

~Print / Book~
Microsoft Visual Studio "Dev11" Preview Book

Print design and layout for the Visual Studio 2011 Product guide.

More ⇨

~Print / Book~
At&t 2010 Developer Summit Website

At&t 2010 Developer Summit Registration Website

More ⇨

~Websites~
AT&T 2010 Certified Solutions Catalog

Printed catalog of solutions that have been certified with AT&T. This catalog was created in 2009 to update the existing catalog with new content and design guidelines. Rather than create a simple linear list of solutions, the catalog is categorized in two different ways; by solution vertical(telecommunications, manufacturing, legal...etc) and cross industry (security, email, VPN...etc). A Content Management System was created to store and manage the catalog data.Images, logos and content was then imported and laid out dynamically so that content could be easily edited and changed without having to manually edit the document.

More ⇨

~Print / Book / CMS~
At&t devCentral Certified Solutions Toolkit

UI /UX Design for the At&t devCentral Certified Solutions Toolkit DVD. XML Driven WPF application.

More ⇨

~Print / Application / Interactive / DVD~
At&t devCentral Sales Kit DVD

UI/UX Design for the At&t devCentral Sales Kit. XML Data Driven WPF application.

More ⇨

~Application / Interactive / DVD~
Microsoft BI Sales Configurator Tool

Internal Microsoft Silverlight Application designed to help the BI Sales force find targeted content quickly and effectively. Initally XML driven, the interface was later ported to utilize SharePoint lists.

More ⇨

~Interactive~
Microsoft Branch Office Infrastruscure Solutions

BOIS Solution Architecture poster designed to display the different scenarios in a manner that helps communicate the specifcs of each solution. Custom graphics were created to help identify the required hardware, software, bandwidth and pros/cons of each solution

More ⇨

~Print / Poster~
Cloud Vineyards Loyality Portal

Prototype Silverlight Application designed to show how a customer loyality portal could use Silverlight to enhance the Customer Experience.

More ⇨

~Interactive~
Content Master Promotional Material

Promotional and Marketing materal for CM Group, Luminosity and Content Master.

More ⇨

~Websites / Promotional / Logo/Type / Datasheet~
Microsoft Core Infrastructure Partner Readiness DVD

Sales DVD with WPF application designed to provide easy access to targeted content. Created UI, DVD label and Sleeve

More ⇨

~Application / Interactive / DVD~
C# for Java Developers Poster

Two quick reference posters designed to provide an comparison of C# for existing Java Developers.

More ⇨

~Print / Poster~
Visual Studio Team Foundation Service Limited Edition Preview

Print design for a limited edition Visual Studio Team Foundation Service Preview Invite.

More ⇨

~Print / Promotional~
Visual Studio Team Foundation Service Preview Invitation

The most basic and least exclusive version of the "Golden Ticket" series for the preview introduction of Visual Studio Team Foundation Service Preview. This is currently called VS Online.

More ⇨

~Print / Promotional~
Microsoft High Performance Computing Animation

Technical Animation and Custom Video Player. Many UI improvements and custom controls helped create a Next Generation player.

More ⇨

~Videos / Animation~
Interoperability Bridges Website - Microsoft

UI Design for Microsoft Interoperability website

More ⇨

~Websites~
Windows Intune Laptop Stickers

Laptop Sticker Design for Microsoft Intune.

More ⇨

~Print / Promotional~
Luminosity Branding, LMS and Datasheets

More ⇨

~Print / Websites / Promotional / Logo/Type / Interactive / Datasheet / CMS~
Novartis Sales Tool UI/UX

UI/UX Design for Novartis. Designed to be used in the field to provide the salesforce an efficient way to access sales material and objection handling documentation. WPF XML Driven

More ⇨

~Application / Interactive~
Microsoft Quicktakes Animations and Videos

Animations, Videos and Branding for Microsoft "Quicktakes". Created animated style. Directed videos and editing.

More ⇨

~Videos / Illustration / Animation~
SQL Server High Avalability Poster

Design for the Microsoft SQL Server High availability poster.

More ⇨

~Poster / Illustration~
Stickers, Shirts and other Promo items

A variety of promotional items such as stickers and t-shirts. This page is a general catch-all designed to showcase some of my favorite pieces.

More ⇨

~Print / Promotional / Illustration~
Syngo Dynamics Animation

Technical Animation and Custom Video Player

More ⇨

~Videos / Animation / Interactive~
Visual Studio Partner Portal

UI/UX Design for the Microsoft Visual Studio 2010 Partner Portal. Silverlight and WPF Applications

More ⇨

~Websites / Interactive~
Woodland Park Zoo Conceptual Design and Icons

Conceptual design for Seattle based Woodland Park Zoo. Custom icons and layouts. X

More ⇨

~Print~
Artscorps - Website redesign for Seattle based Non-Profit

Arts Corps is the largest nonprofit arts educator in the Seattle area. In 2002 the site was re-designed to provide a more modern look and easier access to their content. Later, a dynamic JavaScript based image gallery was developed to streamline the creation of new image galleries and keep the content up to date.

More ⇨

~Websites~
Microsoft Dream Server Website

Silverlight 1.0 Development. Developed interface to .PDF designs. Manually syncronized XAML to video mapping of a dynamic text box.

More ⇨

~Interactive~
Content Master Website, Photography and Development

Design and Development of the Content Master website. I created a long panoramic photograph of the Seattle Waterfront by stitching together multiple photographs. The image stitching was done manually using Photoshop. Once the panoramic was generated, the image was then split into multiple layers based on how close the objects were. The foreground has the iconic Seattle Space Needle and a few others separated from the background so that dynamic cloud effects could appear to flow through the city. A few randomly blinking lights further enhanced the overall effect. When the user clicks between sections, the entire city blurs and moves to the chosen section. Flash, AS3, Photoshop

More ⇨

~Websites / Interactive~
The Art Institute of Seattle - FUEL Magazine

Founded FUEL while at the Art Institue of Seattle in 2007. Page layout, Print Design and Writing for the first 3 issues.

More ⇨

~Print~
Light Sciences Oncology Flash Website

Flash and HTML Website Design for Snoqualmie based Light Sciences Oncology

More ⇨

~Websites~
Technical Graphics

Various technical diagrams and graphics for Microsoft and others.

More ⇨

~Promotional / Icon~
Bahn Brenner Website, Photography and Print Design

Graphic Design and Photography for Bahn Brenner Print ads and Website.

More ⇨

~Websites / Promotional / Illustration~
CA Recovery Management Poster

Technical poster design for CA.

More ⇨

~Print / Poster~
Hard Liver Barley Wine Logo Concept

Type and logo design inspired by the Hard Liver Barley Wine festival.

More ⇨

~Logo/Type~
Jiggleberry Juice Bar Website

Site design and Development for Texas based Jiggle Berry Juice. PHP, MySQL.

More ⇨

~Websites~
silverlighttoys.com Website and Content

Created Silverlighttoys.com while at Content Master. Created technical showcase samples highlighting Microsoft Silverlight features.

More ⇨

~Websites / Interactive~
Microsoft Executive Briefing Center - device bar animations

Windows 8 device bar animated display design and hardware spec. Utilized Microsoft PowerPoint to create an advanced slideshow that spans across 5 full HD seamless displays.

More ⇨

~Animation~
Microsoft Big Data Animation

Concept, storyboarding and animation for several Microsoft Big Data videos.

More ⇨

~Videos / Animation~
Victory Lap - POC

Concepting and ui/ux design for a multi-tier, ranking, award, social and BI app. Created to show how gameification, social networking and Big Data could be used to enhance the Mobile device user experience. The system was intended to be run from a Cloud service to provide realtime data and allow for large scale computing to power the results and drive the dynamic UI elements. The overall visual design was intentially kept sparce and limited to using color for communication purposes. The actual branding of the final system would be based on the system palette of the device. Designed at Content Master with Chad Lundberg.

More ⇨

~Application / Interactive~
Arches Technology Wordpress Website Design

HTML5 based Wordpress website.

More ⇨

~Websites / Icon / HTML5 / Wordpress~
Visual Studio #herodev Superhero Cape and Graphics

Concept & Design for Microsoft Visual Studio #herodev Campaign. Designed Graphics and came up with a Super Hero cape to give out to attendees.

More ⇨

~Promotional / Illustration~
Centrinet Wordpress Website Design and Development

Wordpress website for Centrinet.

More ⇨

~Websites / HTML5 / Wordpress~
Bainbridge Island Brewing Photography

Photography for Bainbridge Island Brewing

More ⇨

~Websites / Photography~
Washington Federal - Bainbridge Island Branch Photography

Branch photography for the newly built "Micro Branch" concept

More ⇨

~Photography~
MSDN "Take The Tour" - Prototype Silverlight UI

Prototype UI developed for MSDN "Take The Tour. XML driven to allow for rapid content updates Utilizes perspective transforms and multi-state animations to give the illusion of the virtual info panes flying through 3D space. Vector based controls used animated gradients to give the panes dynamic lighting effects. The left navigation used a custom "Fisheye" style that increases the size of the item that is hoverd over. Touch swipe was also added to utilize touchscreens.

More ⇨

~Websites / Interactive~
Microsoft Forefront Training Kit

Data driven user interface for the Microsoft Forefront Training Kit. Silverlight, XML

More ⇨

~Websites / Interactive~
Microsoft SQL Server 2008 - Parallel Data Warehouse - Animations, UI and Player

A series of 4 animations for Microsoft SQL Server 2008 Parallel Data Warehouse. Custom UI and Video player developed in Silverlight.

More ⇨

~Websites / Animation / Interactive / Photography~
Ayeckel.com v1.0 - Student Portfolio Flash Website

Flash based Student Portfolio Website. I photographed a remote area of Alaska during the summer solstice. 8 photos taken from my Nikon D70 were stitched together to form a single image. The foreground, mid and background were seperated into layers and saved as transparent .png images. They were imported into Flash as seperate layers and custom mouse interaction and parallax code allowed the scene to appear realistic. Randomized clouds moved behind the hills to give a sense of motion and reality. When the scene moves towards the left, the lens flare from the sun rotates into position. The project icons animate into position virtually infront of the whole scene. They also blur similar to depth of field and fly into focus. The custom mouse code comes from very first portfolio website (sixspeedmedia.com 2003) where I allow the content to automatically scroll in relation to the mouse position in a way that lets them see content off screen. In the case of the parallax scene, the mouse allows the user to see my projects by simply moving the mouse across the scene. A motion blur effect was also added to the project icons and varies based on the mouse acceleration values.

More ⇨

~Websites / Interactive / Photography~
Messageglue Wordpress Website

Wordpress website for Messageglue.

More ⇨

~Websites / Wordpress~
Archived Student Portfolio Site (2003)

Flash based Student Portfolio Website from 2003. Custom Carousel was created and unheard of at the time. Other mouse scrolling code became a dynamic parallax site later on.

More ⇨

~Websites / Interactive~
3M Respiratory Protection Resource Guide - iPhone and Android

I designed the UI and Icons for the app. Using the free app, industrial hygienists and safety professionals can quickly get answers to frequently asked respiratory questions, check the 3M respirator selection guide, identify 3M facepieces, cartridges and filters, walk through an overview of qualitative fit-testing protocols, and conduct fit tests.

More ⇨

~Application / Icon / Interactive~
Luminosity Website Series

Designed and built a series of websites for the Luminosity brand of products including Studio, Reach and Synergy.

More ⇨

~Websites~
Luminosity Course output UI and Custom Skins

Created the "Next Gen" output for CMGroup Luminosity.

More ⇨

~Websites / Interactive / CMS~
Slide View / Multi View UI Design

Slideview is a concept that goes back to my days at The Art Institute of Seattle. I designed an interface that broke from the normal rules and created a design where the items were large horizonral sliding icons. An Icon can represent a folder or an individual item and changes layout to help communicate the differences. Multi-Touch and Swipe support were added to utilize the new and cutting edge multi-touch interfaces on the market at the time. The ui was data-bound to an xml file or Sharepoint list that has a matching file structue to hold the images. Multiple views were added so the user can switch between Slide, Grid and List views.

More ⇨

~Websites / Interactive / CMS~
Microsoft Surface 1.0 Design and Development Training Course Graphics and Skin

Custom Luminosity Skin and graphics for the Surface 1.0 Training Course

More ⇨

~Websites / Interactive~
Open Road Winery Photography

Photographic concepts for Open Road Winery. I used retro SLR lenses with adaptors on my Sony NEX 5n mirrorless camera. Most of the variations came from using alternate color light sources and changing lenses. Most of this series were shot on a 80's Minolta 50mm f1.4 manual focus lens. This gave me good sharpness but a narrow depth of field which I used to separate the bottle from the background. The older lens has a distinct look compared to the factory lens that came with my NEX. Using an f1.4 allowed me to illuminate the scene using only tea candles while still keeping the exposure short to minimize any vibration.

More ⇨

~Photography~
Back to top