Portfolio
X
Taco Tuesday
AfterEffects Animation
CHOMP! My AfterEffects skills were getting rusty, so I decided to refresh them by making a video game featuring taco-eating heads. Using vector graphics provided by Jake Bartlett, the animation was brought to life through a variety of keyframes, visual effects, and typography. There's even a tiny easter egg referencing the novel "Good Omens," by Neil Gaiman and Terry Pratchett. Can you spot it?
Unplugged Retreat
HTML and CSS Responsive Website
Now that I had a one-page responsive website under my belt, it was time to bring out the big guns and build a responsive website with not just one, but three pages! Working from a Photoshop design comp, I carefully coded sections, styled typography, and applied display: flex more times than you could shake a stick at. The end result is a well-crafted site that fits perfectly on whatever size screen you choose to use.
Jet Ski Website Idea
HTML, CSS, and JavaScript Website Exercise
When you hear about a cool-as-heck project through the grapevine at work, what else can you do but use it as an excuse to practice your web design skills? After hearing about designs for an all-electric jet ski, I took the opportunity to design an electirfying website to give it a digital home.
Rogue Pickings Goes Responsive
HTML5 and CSS Responsive Website
Designed to adapt to screen sizes ranging from phones to tablets to computers, this one-page website was created using mobile-first design principles and a healthy dose of flexbox. Font sizes were carefully converted from pixels to em units, widths were set at percentages, and display: flex was added to just about everything. With nary a pixel dimension or set height in sight, this site was carefully built to shine on any screen.
Jubilee Austen
Multi-Page HTML5 and CSS Website
A fully functional multi-page website, this project was coded to match a given Photoshop design comp. After extracting all the images and icons from the design comp, I annotated the comp with notes about everything from font sizes to line heights to border widths. With these notes to guide me, the HTML was written out and then and styled with CSS to create a pixel-perfect copy of the original.
Desktop Rogue Pickings
HTML5 and CSS Website
With a one-page design comp in hand, the task was clear: bring the design comp to digital life by applying my coding skills. Step one was roughing out the HTML structure and filling it with copy so all the pieces were in place. After making some quick annotations on the comp to help remind me what colors went where and which font sizes were applied to which pieces of copy, step two was turning the boring wall of text into an engaging web page with the help of CSS styling.
Recipe Collection
CSS Styling Exercise
You could simply type out your favorite recipes in a Word document, or you could style custom recipe cards for them... so that was what I did. Given the HTML structure and copy, along with a set of icons and images, I applied CSS styling to transfrom a plain list of recipes into a jaunty digital recipe box.
Another Day, Another Project
SketchUp Experiment
What happens when you give a girl in the middle of her Master’s program nine weeks of Christmas vacation, a 30-day free trial of SketchUp Pro, and unfettered access to an array of YouTube tutorials? You get an experiment in 3D modelling that takes on a life of its own. After researching symbolism to represent parts of my personality, the chosen emblems were combined to create a trio of unique chess pieces, and a custom board created to display them.
A Love Triangle
Type Specimen Book
In true “more than meets the eye” fashion, this type specimen book uses the font "Mrs. Eaves" to tell not one, but three intertwining stories. The stories are brought to life by three key characters: font designer John Baskerville, Mrs. Eaves, his housekeeper and love interest, and finally type designer Zuzana Licko. Resembling an annotated script, the book introduces each character using a dramatis personae.
The Project I Couldn't Get Enough Of
Instagram Video Promotion
Appropriately titled, because I did this Instagram video assignment to promote the Seattle Wedding Show not once – but twice! After completing the first variation featuring a paper doll motif done in soft pastels, I was struck by the desire to also create an alternate version. This second option has a more contemporary look, tone, manner, and feel, echoing fashion illustrations and runway shows for brands like Dior and Chanel.
Lurking Beneath the Surface
Motion Design Infographic
The challenge was to convey an ecological disaster and its 70-year fix in a soundless infographic video. Oh, and did I mention the run time had to be 30 seconds or less? Specifically, I was looking to portray the cleanup of the River Thames from the 1950s to today, showing its progress over time from a lifeless dead zone to a thriving river home to upwards of 20 fish species.
Coding Among the Carrots
HTML, CSS, and JavaScript Game
My favorite project to date is this drag-and-drop garden game I coded from scratch. After researching to create the persona of a 7-year-old girl who would be the potential user, I roughed out pen-and-paper mockups for A/B testing before refining the site’s pages via a clickable prototype in Adobe XD. Then I wrote the HTML to bring the site to life, added style with CSS, and learned some JavaScript on the fly to make the game operable on both desktop and mobile.
The Not-So-Humble Ampersand
HTML5 and CSS Exercise
For my first official foray into HTML and CSS, I analyzed a single character: the ampersand in Benguait Pro ITC Medium Italic. The focus of this project was to explore the details that make this typeface special. All the elements used to explain the ampersand’s features were first drawn in Illustrator, then colored in Photoshop, before being exported with transparency for incorporation into the code.
The Designer's College Football Playoffs
Photoshop and Illustrator Design Presentation
The pageantry and traditions defining Notre Dame football run deep and wide. For an aspiring designer, the most important tradition is vying for the opportunity to design The Shirt – Notre Dame’s most coveted game wear and successful fundraiser. The annual selection process involves crafting multiple iterations showcasing custom iconography imbued with symbolism from Notre Dame’s storied past. I was immensely proud to be selected as a finalist for The Shirt 2020.
Fresh From the Land of Crazy Ideas
Business Plan and Pitch
As a personal project, I created a contemporary line of collegiate wear featuring fabled Notre Dame stories. Called SPIRIT LORE, the brand’s development process included analysis of target demographics, strategic assessment of marketing channels, and creation of all visual content – from designs to custom hangtags. My fledgling company went on to successfully compete in The IDEA Center’s student entrepreneurship competition, where it won seed money from Notre Dame to help fund its launch.
Beyond the Basics
AfterEffects kinetic type exercise
Using motion to personify letters can bring a word to life, and in the process, help define the word and add impact to its definition.
Deep Dive
Photoshop and InDesign Exercise
Challenged with selecting a set of antonyms that accurately described me, then altering a self portrait to reflect those chosen words, turned into a personal introspection as much as a design project. After much contemplation I selected SOFT and STEELY as my antonyms of choice, and set about finessing my self portrait to reflect the qualities of those words through image, color, and application.
Animal + Alphabet
Photoshop, Illustrator, and InDesign Exercise
The process of creating a letterform using an animal as inspiration took me down a very well trampled path! At times it felt as if I were back in Kindergarten studying and discovering the details of various animal forms for the first time. Now, if I could just recapture the wonderful smell that comes from opening a fresh box of crayons...
Under Siege
Illustrator and Photoshop T-Shirt Designs
A paintbrush-wielding mini-ninja notwithstanding, Art Attack is an event that provides one-stop shopping for first-year students to explore the University of Notre Dame's arts scene. For the 2017 t-shirt I created three mannequin-like figures. I chose mannequins because in addition to their use in art, they reminded me of the target audience: students who are youthful works-in-progress.
