ELearning Developer
Multimedia and Graphic Designer

Storyline - 360° Interactive

October 2024. Background image designed and created using Blockade Labs AI (panoramic image generator), and modified in Photoshop and Illustrator. (I did not write the text within)

Interactive Learning Objective Generator (2024)

Storyline 360. I designed and programmed this interactive app to support a train the trainer course for new instructors. Assets designed and developed using Photoshop and Illustrator. Select the link at the bottom to view live demo.

Train the Trainer - eBook Module (2023-24)

Module covers training overview and requirements. Built with Storyline 360 and visual (images, video, animations) assets built using AI image generator, Photoshop, Illustrator, After Effects, and Premiere. Select the link below to view live sample.

Global Support Ops - eBook Training Module (2023)

Built using Storyline 360, with assets built using Photoshop, Illustrator, Premiere, and After Effects. Misc examples of tab interface, flip card reveals, animations, video, et al. Select the link below to view live sample.

eBook Training Module (2023)

Storyline-built; assets built using Photoshop, Illustrator, Premiere, and After Effects. Select the link below to view live sample.

Interative Radar Display Training Demo (2022)

Semi-interactive, simulation of control tower radar display control. Mimics the general experience for a tower controller and how they'd interact with the screen while monitoring flights. Built in Storyline (using multiple variables and triggers); with video animation captured using Storyline's screencasting function, audio edited in Adobe Audition, and additional visual assets built in Photoshop and Illustrator.

Unmanned Air Vehicles - Storyline (2021-22)

Storyline 360 built FAA course module. Animation created with Vyond, and all other visual assets designed and created with Photoshop and Illustrator.

Navigation Module (2021)

Built using Storyline 360. Animation built in After Effects, audio edited using Adobe Audition, and other visual assets in Photoshop and Illustrator.

Storyline Course with Branching

Online example includes an AI help “chat bot” (Cluelabs). Open the link below, and look in the lower right of the window (Click the ? chat bubble). Select the link below to view live sample.

Misc Storyline Layouts (with and without Motion Gfx)

Used After Effects to create motion graphics and placed clips into Storyline. This sample includes both motion layout and 100% Storyline layout themes. Select the link below to view live sample.

Storyline Title Slide (2022)

Animation in After Effects; built in Storyline 360

Airline-Themed Storyline Template (2021)

Starter template designed in Storyline. Background and static visual assets created using Photoshop and Illustrator (animation was done within Storyline).

Storyline Micro-ELearning Interface

“M.E.M.O.” = Micro ELearning Mastery Opportunity: Interface designed using Adobe Illustrator, Adobe Photoshop, Vyond, and built and published in Storyline. Concept created by Kathy V. as a means to socialize/increase knowledge of ELearning design standards for non-designers tasked with ELearning development. Select the link below to view live sample.

Storyline with Vyond Animated Content

Cost of not hiring the right employees. Built in Vyond and published in Storyline. Select the link below to view live sample.

Storyline Sample

Standard course built using Storyline, visual assets/graphics in Photoshop and Illustrator. Select the link below to view live sample.

Storyline with Animated (MP4) Content

Storyline built demo of software application. Assets designed and developed using Photoshop, Illustrator, and Storyline's screencasting app. Select link below to view live demo.

Storyline with Animation (Originally created in Flash)

Storyline built demo of software application. Assets designed and developed using Photoshop, Illustrator, and Storyline's screencasting app. Select link below to view live demo.

Storyline Template Designs

Low-poly template design in multi-color options. Select link below to view live demo.

Captivate Sample

“How to Create a Custom Character in Vyond.” Animation built in Vyond. Compiled and published in Adobe Captivate.

Domiknow Course/Job Aid

Built using Domiknow Flow.

Domiknow Job Aid

Job aid built with Domiknow Flow.

Training Portal (2018)

I designed and maintained this training portal using Lectora with CSS etc to support various training programs for financial services representatives. Used product branding (logos, icons and colors) to create a consistent/cohesive theme. I do not have the original Lectora file to publish an active online demo; but this screen shot shows the most recent portal home page.

Career Options/Tech Career Path Course (2010)

Lectora-built course describing career options and technical career paths for an engineering firm.

Lectora Course - Performance Based Interviewing (PBI) for new HR reps. (2005-06)

Highly abridged sample of interviewing course. Note - This sample was published using a trial version of Lectora, so functionality is limited.

Lectora course - Stop n Shop "SCAN IT" Trainer Curriculum (2012)

Train the trainer course for SCAN IT scanner/self checkout device for large grocery chain trainers.

Gamification - Authorware Course

My first ELearning project, 2001. I designed and developed a mandatory employee Information Security Policy Awareness course with interactive scenarios and games within a relatable, customized visual interface built using Authorware and Adobe CC. (Note: Since modern browsers do not support Authorware web-published content, I had to create a screencast video on my laptop running an executable, or “.exe” packaged version of the course to demonstrate it in action.)

Course Interface

Designed in Photoshop and published in Storyline.

Lectora Course User Interface

Storyline Template Designs

Engineering UI - Remote Turbine Control Monitoring System

User Interface - User interface designed for a remote turbine control monitoring system. UI software: Wonderware InTouch.

Engineering UI - Remote Turbine Control Monitoring System

User Interface - User interface designed for a remote turbine control monitoring system. UI software: Wonderware InTouch.

UI designed for online interactive job aid I created using Domiknow, Illustrator, Photoshop, and CSS styling for various design elements.

Illustrator/Photoshop

Used Illustrator and Photoshop to modify this infographic to create an engaging user interface in Domiknow to create an interactive job aid.

User Interface

Landing page/portal mockup - Photoshop.

User Interface

Landing page/portal mockup - Photoshop.

Landing Page (web)

Landing page/portal design. Photoshop and built using Lectora, published as web page. Modified published HTML output and added customized CSS styling.

Course Intro Page

Web page built using D2L Brightspace (web-based course content management system); graphics designed using Illustrator and Photoshop. Modified HTML source code and applied CSS styling throughout to create consistent aesthetic to match overarching brand. I created several of the "badge" graphics which were awarded at the completion of each module in the series. (several examples included in this portfolio)

Course Module Intro

Built using Brightspace; banners/graphics/badges designed in Photoshop and Illustrator. Modified HTML source code and applied CSS styling throughout to create consistent aesthetic to match overarching brand.

Course Module Intro

Built using Brightspace; banners/graphics/badges designed in Photoshop and Illustrator. Modified HTML source code and applied CSS styling throughout to create consistent aesthetic to match overarching brand.

Course Module Intro

Built using Brightspace; banners/graphics/badges designed in Photoshop and Illustrator. Modified HTML source code (to extend design complexity beyond “WYSIWYG” tool capabilities) to edit and apply CSS styling throughout to create consistent aesthetic.

Course Intro

Built using Brightspace; graphics/banner designed in Photoshop and Illustrator. Created a brand palette using hex colors. Modified HTML source code (to extend design complexity beyond “WYSIWYG” tool capabilities) to edit and apply CSS styling with chosen hex colors throughout to create consistent aesthetic.

Course Intro Page

Built using Brightspace; graphics/banner designed in Photoshop and Illustrator. Modified HTML source code (to extend design complexity beyond “WYSIWYG” tool capabilities) to edit and apply CSS styling throughout to create consistent aesthetic.

Fictitious logo

Branding design/logo. See it in context at the link below.

Course "Logo" Splash Screen

Internal Product Logo

Logo designed for an internal audio service and podcast. Illustrator and Photoshop

Internal Product Logo

Logo designed for an internal audio service and podcast. Illustrator and Photoshop

Customer Support - Volunteer

Logo image I designed and contributed to support Market Basket customers in support of their workers who went on strike in 2014.

Cover Art

Photoshop and MS Word - designed this cover art for a software setup manual.

Marketing/Proposal Cover Design

Engineering firm - Designed all standard marketing printed materials, including this proposal book cover.

What are CMOs?

Infographic designed to visually explain Collateralized Mortgage Obligations (CMOs) on a Quick Reference Card PDF. Audience was financial customer services call center representatives. See the full quick revenue guide PDF in the attached link.

ELearning interactive infographic

Illustrator and Photoshop

Illustrator and Photoshop

Illustrator and Photoshop

Illustrator and Photoshop

Illustrator and Photoshop

Illustrator and Photoshop

Illustrator and Photoshop

Illustrator and Photoshop

Illustrator and Photoshop

Medical Equipment Illustration

Illustrator - designed this visual asset for a medical online course.

User Interface

User interface designed for a remote turbine control monitoring system. UI software: Wonderware InTouch.

User interface

User interface designed for a remote turbine control monitoring system. UI software: Wonderware InTouch.

Engineering Marketing Diagram

Diagram imported from AutoCad and modified in Corel Draw (vector illustration tool, similar to Adobe Illustrator) and used in 4-color printed marketing materials.

Engineering Marketing Illustration

Diagram created in Corel Draw (vector illustration tool, similar to Adobe Illustrator) and used in 4-color printed marketing materials.

Engineering Marketing Illustrations

Diagram imported from AutoCad and modified in Corel Draw (vector illustration tool, similar to Adobe Illustrator) and used in 4-color printed marketing materials.

Engineering Marketing Illustrations

Diagram imported from AutoCad and modified in Corel Draw (vector illustration tool, similar to Adobe Illustrator) and used in 4-color printed marketing materials.

Covid Composite 2020

Graduating class of 2020 were not able to get their group shot taken together because of Covid restrictions. Enter Photoshop!

Photo Retouch

Used Photoshop to create image on right from image on the left.

Marketing Brochure

Designed using Photoshop, Illustrator, InDesign, and published as PDF.

Full page magazine ad

Advertisement in SHRM magazine for MindEdge (Online learning provider for Corporate and Higher Education - mindedge.com). Designed using Photoshop and Quark Express, output as PDF. Client wanted minimalist style. I chose this image to convey the message, and the client loved it.

High School Event Program

Designed using Photoshop, Illustrator, and published using MS Word (The school wanted to have an editable file of this for future use, and they , used MS Word)

Silly

Spoof on a Monty Python classic. Photoshop

Me

Fun with Photoshop :)

“Spunky”

Based on black and white photo (taken by Matt Wall, ~1970. Family dog, Collie/German Shepherd/Beagle mixed breed.)

T-Shirt Design

Commemorative T-Shirt design for a group of friends who traveled to see the Tour De France in 2002.

Birthday Banner

Photoshop and Illustrator - for my favorite Father in Law :)

Butterflies Illustration

One of my first digital drawings - I used CorelDraw and drew this from scratch. (This is a colorized copy of a photocopy as I no longer have the digital file)

Visual Asset

Visual aid "neon" sign created using Photoshop - used as a visual asset for an online course.

Sumi-e

My one and only attempt at Sumi-e painting.

MT

Coolest dog on the planet. Hand sketch from a photograph. (In case you're wondering, she's wearing doggie rain boots which were unfortunately, one size too big. She looked a bit like a Queen Anne chair wearing these. She stood still long enough in them for me to take the original photo, then promptly kicked off and sent all four boots flying, never to be seen again.).

Digital watercolor

Used iPad ArtCanvas app to simulate watercolor painting

2022 Watercolor

First attempt at watercolor painting. :)