Hi, I’m Melanie. I make mostly websites, mostly with design and front-end code. Right now I’m a PM on the Microsoft Edge team, helping to shape the web platform. (If you’d like to learn more about what that means, check out my bio!)
Selected projects
HTML5 Accessibility
HTML5 Accessibility was created by The Paciello Group, a web accessibility consultancy. The site shows whether or not browsers have implemented HTML5 features accessibly, such that users of assitive technology can interact with web content successfully. This of course helps inform web developers of potential issues to look out for, but the test pages also allow browsers to verify that they've implemented features correctly. It was mine and David Storey's (as Microsoft Edge team members) pleasure to support this effort with a redesign.
Highlights Collection
I read quite a lot, so I thought I’d make a minisite to collect meaningful or interesting passages from the books I’ve read. Side projects are a great way to test out new ideas, and on this project I’ve been able to play a bit with interaction media queries. Here I’m detecting whether the user’s device supports hover interactions; if not, give them regular book covers, but if hover is available, fade from low fi to high fi imagery when the user mouses over a book.
Variable Fonts Demo
This Microsoft Edge web dev demo showcases variable fonts, or an extension to OpenType where one font file holds information about an entire font family. Developers can use CSS to adjust various “axes”, in order to manipulate various properties of the font, such as weight, width, and decorative elements in the glyphs. This demo shows how developers can get quite expressive with just one font file—and can even animate these properties on the fly. Favorite design details include the ice floe-breakup on scroll, as well as heading animations.
Microsoft Edge Web Summit
2017 marks the first year that the Microsoft Edge Web Summit was held in Seattle, WA. I decided to play on a couple themes for the year’s esthetic: the Emerald City, and a hiking/camping theme (also a riff on the term “summit”). Designing for the event meant extending the brand to tons of various collateral, some of which include the website, merch, environmental graphics, and wayfinding materials.
The Green Heart Project
The Green Heart Project is a fantastic group that facilitates school gardens in the Charleston, SC area. The task was to update their iconic "green heart" emblem and from there build a fresh new identity.
Badass Lady Creatives
Fed up with gender-related controversies in the design industry, I started Badass Lady Creatives, a project that honors women in design, illustration, development, and beyond. I’m currently in the midst of making accessibility improvements to this older site—that color contrast, for one, leaves much to be desired!
The Nickelodeon
The Nickelodeon is an alternative, nonprofit cinema which seeks to educate and entertain the community through films, festivals, and events. This beloved cultural center in Columbia, SC needed an identity refresh that felt both intelligent and off-beat.
Fuzzco client projects
Browse archiveMisc illustrations
Browse archiveOther little things
-
Bucket List
Activities I’d like to try in the Pacific Northwest and beyond.
-
Just! Build! Websites!
A brainstormed list of side-project ideas so people can improve their web design and development chops
-
100 Days of Spec
I read the HTML specifications for 100 commutes and learned a whole bunch.
