Marshall Art Studio

Web Developer + Designer

(2004 - 2007) Front-end visual design for the LTSave websites, within the software development team. Hand-coded in .NET (HTML, CSS, XML/XSLT), created graphics. Focused on core functionality, user interface concepts and content management. Supported marketing department with print media; developed visual design and production for brochures, direct mailers, slideshow presentations and packages.

• CSS Expertise Unified similar-functioning styles, introduced CSS positioning for page layout, wrote styles for main navigation and interior content; designed styles to work in cross-platform, cross-browser environments
• Visual Design for Raw Prototypes Specific examples include the main navigation, Risk Calculator, data comparison charts, Report Card, and login/registration boxes
• HTML Email Newsletter Created visual design, graphics and coding; HTML design made flexible for seasonal content updates; worked within the technical parameters defined by third-party vendor
• Portal Website Created visual design, graphics and coding; updated page design as content and UI evolved
• Corporate ID Unified visual style conventions of printed marketing material (source files from Microsoft Word + PowerPoint, Adobe InDesign); pieces include a pocket folder, a user manual, trade show graphics

[Back to top]

Specific Highlights

Web Design + Development: User Interface Sampler One

(2006) Clockwise from top left: Mini Report Card, Med Insurance Policies, Risk Slider, Registration FORM

[Back to top]

---

Web Design + Development: User Interface Sampler Two

(2006) Retirement Guide, Action Steps 3-Tab. Module + graphic design

[Back to top]

---

Web Design + Development: User Interface Sampler Three

(2006) - What Does It Cost, Numbers That Shape, Accout Details

[Back to top]

---

Print Design + Production: University of Miami Benefits Update

(2006) Full color, 4-page, single-sheet newsletter.

[Back to top]

---

Presentation Design: Miscellaneous Presentations

(2006) Designed to match material built with page layout applications, such as Adobe InDesign or Quark XPress. The challenge: PowerPoint doesn't have the object management tools of those page layout applications (linked images, right-align, styles or layers).

[Back to top]

---

Print Design + Production: Instructional User Guide

(2005) Full-color, 5 ½" x 8 ½".

[Back to top]

---

Print Design + Production: Pocket Folder

(2004) Designed to hold modular collections of lettersize marketing material. Designed, developed and produced from start to finish. Custom die-cut, special color separations.

[Back to top]

---

Additional Highlights

Company Intranet | website

This was a company learning experience for using XML/XSLT. Success here would allow us to drive a lot of our content and navigation for the live site in XML (Content previously living in the DB or embedded in static ASPX files). Hammering my first XSLT to spit out the correct form was a rich and rewarding experience.

[Back to top]

HTML Email Newsletter | example

Part of an overall marketing campaign designed to create greater visibility. Working through the usual creative process, I created the visual design, graphics, type treatment, as well as the markup and CSS.

• Coded in standards-compliant XHTML Strict + CSS for greater SEO
• Worked closely with email tracking vendor Constant Contact

[Back to top]

Banner Ads (Internal) | Example

These internal banners were designed for use in the pre-registration pages, to provide subtle reinforcement of LTSave's core principles. The choices of stock photography reflects the "People Who Use LTSave" theme used throughout the banner ads, landing pages and pre-registration pages.

• Designed "quite sell" look of the ads
• Designed "ghosted pinstripe" look of the photographs, making them unique and enhancing the LTSave brand
• Based slogans on abrreviated "LTSave Principles" from the Company pages
• Matched appropriate photos with slogans
• Modified content and form throughout the entire creative process

[Back to top]

Banner Ads (External, Linked to Landing Pages) | Examples

Designed for use on external financial websites, such as Yahoo Finance. Each banner links to a corrosponding Landing Page.

• Reached standard (voluntary) banner sizes
• Designed ad and copy to maximize approved essentials (happy person, price of offer, branding)
• Created multiple versions, spotlighting a range of ages and ethnicities

[Back to top]

Landing Pages (Linked from External Banner Ads) | Example

A more detailed presentation of the content only hinted at in the Banner Ads. These pages feature 5 LTSave principles, and links to the Online Tour and Registration page.

• Designed visual style and interface, with a nod to the existing LTSave styles
• Wrote copy for headline, subheadline and opening paragraph
• Designed HTML structure for easy content modification
• Wrote cross-platform hide/show Javascript, allowing each principle to be seen at the user's convenience
• Designed "Sign Up Now" button, the style of which was late applied to all other pre-registration buttons

[Back to top]

Online Tour | Example

A presentation of how to manage an LTSave account. Individual features are highlighted and explained. Potential customers get to this tour either through the pre-registration pages or the Landing Pages.

• Took existing content; redesigned from the ground up
• Designed new page layout, basing text styles on existing LTSave look
• Improved clarity of screenshots, used Windows XP version
• Wrote copy, modified text and design during the creative process

[Back to top]