Portfolio

TD Bank Diversity Book

Coffee book celebrating TD Bank’s Diversity, reviewing cross-company diversity experiences.

Description

TD Bank was celebrating its diverse culture by photographing and interviewing various employees for their personal take on diversity.

Included in project was development of design of book and cover, color correction / image processing, and close adherence to corporate branding standards.

Images below include the cover, the promotional pages, and samples pages of content, table of contents, and index page.

Sample images

Skillsets leveraged...

Book Design / Page Construction (Photoshop/Illustrator/Acrobat)
Vector Design / Illustration (Illustrator)
Photography Image Processing / Correction (Photoshop)
Copy Editing

ConceptJS: Lexicons

ConceptJS project included building a lexicon to convey the "visual language" of ConceptJS, which has an unique programming paradigm based on Lambda Calculus.

Description

To overcome the challenge of this new programming model, a visual lexicon was developed that gave users a sense of the differences between Concepts and Lambda variables and common objects, strings and number variable types.

The lexicon was transformed into its own web-font and many of the sample images are screenshots of the lexicon in font library format.

The Concept icon became an asterix between two brackets ([*]), to help web designers and developers associate parallel ideas with CSS, a definition with attributes that could be anything.

The Lambda variable "broke open" the bracket even further, with the Lambda symbol within to represent its relationship to the Concept variable.

Sample images

Skillsets leveraged...

Advanced User Experience Design
Iconography Design
Font Development

ConceptJS: UI Design

Upon completion of the Lexicon strategy, a UI needed to be developed around ConceptJS that allowed users to develop in a web-based environment with four types of views.

Description

The primary user-base was expected to be developers, but the strategy had to encourage web designers to participate as well. Also important to the UI was to expose the variable types, so users could maintain the new associations they were building with the Concept and Lambda variable/object model.

The screenshots provided demonstrate the most navigation, exploration and manipulation within a ConceptJS environment.

The patterns of the 4 panels (Explore, Debug, Inspect, Viewer) were designed to reduce differences. The primary concern was to maintain the same "logic" within the interface.

One important UI strategy was to place the icon for variables wherever possible to help reduce confusion. While this would be considered unnecessary in a normal development UI, the introduction of two new variables (Concept and Lambda) made the visual illustration critical.

Also of note, the exploration of code relationships was consistently built on the idea of OS menus and submenus to help users to conceptualize inheritance models.

Due to the complexity of ConceptJS, one might find it easier to review the UI by going through this YouTube channel for better understanding of how the ConceptJS UI behaves.

Sample images

Skillsets leveraged...

HTML/CSS/JavaScript Design and Development
Photoshop/Fireworks/Illustrator Design
Webfont Design and Development

Janney: Error-Proofed Forms

Many internal clients struggled with electronic forms, causing a remarkable number of IT help desk calls. Objective was to compose a "verify and continue" strategy to form design that eliminated errors.

Description

Error-proof form design strategies were not a part of internal business design protocols at Janney.

These screenshots outline the UX methodology created to create a "no excuse" policy for success by ensuring each step was completed correctly.

Rollout of design protocol was followed by a large reduction in forms-related issue IT service calls. Methods were placed into design support documents as an established protocol.