My focus as a designer is in crafting experiences for users that not only allow them to achieve their goals, but also that do so in a way that feels effortless, authentic, and sprinkled with moments of delight.
In the realm of user interface design, that means low-friction interactions, intuitive controls, and a human touch to create a certain emotional resonance. When I work on branding and marketing, that means avoiding blandness and generality, and instead infusing my designs with a distinctive personality — one that reflects what the brand stands for — in order to connect with people on a human, emotional level.
HiveBio Community Lab
HiveBio Community Lab is a not-for-profit citizen science organization that seeks to build community amongst citizen scientists, provide science education at very low cost, and furnish the community with access to scientific equipment that would be otherwise out of reach.
I took over as Creative Director in January of 2014. At HiveBio, I'm in charge of all creative for the company, including revamping the company's branding, as well as designing signage, marketing materials, packaging, powerpoint templates, company stationery, etc. All design goes through me.
Here's a sample of some of the work I've done in my time at HiveBio
The first thing I did for HiveBio was create a new, more flexible logo and a style guide for colors, typography, and the use of photography and other brand elements.
This process involved sketching, working closely with HiveBio's CEO, and getting buy-off from the executive team before implementing across the wide range of HiveBio's materials.
HiveBio runs a number of classes every month and I design an eye-catching flyer for each one. But though I want each flyer to look unique and attractive, I also want them all to feel like part of the same brand. To that end, each new flyer is designed based on a template for consistency.
The flyers get posted on a number of social media sites online as well as real-life gathering places, so I create web and print versions for each one.
Here are a few of the flyers I've created so far.
I designed a a PowerPoint template for HiveBio, which has been used for a number of presentations, including for the annual board of directors meeting.
I also get the opportunity on occasion to design custom presentations for special applications. Recently I designed a slideshow for a video promoting HiveBio's “How To Build a Dinosaur” class.
HiveBio has a number of signs posted around the lab, as well as promotional signs used at conventions.
The Swarm Conference is an annual gathering of maker spaces, founded by HiveBio. I created a separate brand for Swarm, unrelated to HiveBio's branding.
windows 10 controls
Although my role in the Windows design studio most of the time doesn't involve directly designing apps or controls, I did have the opportunity to work on the design project to converge controls between previous versions of Windows and Windows Phone.
One of the big challenges of Windows 10 was building an operating system UI that would work on giant 4K monitors all the way down to phones, smart watches, and even devices with no screens. That work started with the system controls and figuring out how to reconcile the interaction differences between not just drastically different screensizes, but also very different input methods.
date & time picker
On this project, I helped with several different controls, participating in discussions and critiques, but my main task was to work on the date & time picker control.
As the name implies, this control allows the user to pick a date or time. Before Windows 10, there were a number of different controls with wildly different interaction models and visual treatments.
I did a lot of explorations of different possible interactions, got feedback from my peers, and prototyped some of the more promising options.
The prototype proved very useful to get a sense of how my on-paper ideas translated into actual interaction, and revealed a number of nuances I hadn't considered at first. As I arrived at my solution, I made sure to think through touch vs. mouse interaction, alternate time formats, situations where the timeframe would be constrained, what increments of time a developer might want to specify for the control, and more.
I passed my interaction design off to the visual design team to create visuals consistent with the rest of the operating system. They did their work and passed the final designs off to the controls engineering team, and the control became part of Windows 10.
windows phone battery saver
When I worked on the Windows Phone team, I had an opportunity to work on the UX of the Battery Saver settings page.
Battery Saver allows the user to see which apps are using the most battery, and choose which apps are allowed to run in the background.
The design problem I was solving was that due to a technical limitation, we couldn't show the battery usage as a percentage. I had to find another way to show the user which apps might be using too much battery, and do it in a way that was intuitive, technically simple, and would allow the user to take action with confidence.
Autography is an idea I had for an app that would allow users to collect and share celebrity autographs, similar to an old autograph book, but with social aspects.
Thus far, I've done some of the initial interaction design work, but haven't had the opportunity to take the project further.
portfolio site redesign
Not to get too meta on you, but the first thing I'd like to talk about is this very portfolio site you're looking at right now. My portfolio has gone through several iterations over the years.
One issue I've always had with my portfolio sites is that I always end up throwing something together quickly without a ton of thought or planning, because some opportunity has come up and I need to show some work as soon as humanly possible. Naturally, that doesn't always lead to my best work.
For this latest version, I decided to change that. I put a lot of thought into the visuals, user experience, and information architecture across all screen sizes.
The biggest change I made was to my design process. Though I did some initial explorations in Photoshop and Illustrator, this site was primarily designed in code.
That means there was no gap between what I might design and what would be possible to implement. It also meant that I ran into any problems immediately — how does this element work in responsive? does the experience work as expected? — whereas if I were working with a static image in Photoshop, these issues wouldn't have been revealed until much later. Working this way saved time and resulted in a better overall design.
This was not my first portfolio site, but it's the earliest one I can bear to have visible to the public. I created it after I was laid off in early 2009, when I was in a hurry to get a job. The design was rather "web 2.0" looking, but it was sufficient enough at the time.
I was feeling like my previous portfolio was looking pretty dated. For this redesign, my goal was to create a design that was an extension of the design of my personal site (www.milesgrover.com), which I was pretty happy with. That meant glitchy graphics, harsh colors, and skulls.
Eventually I decided that though I liked the design of my personal site, that aesthetic was probably off-putting for people without context, and likely was distracting from the work I was trying to show. I took the same basic design and toned it down: smoother graphics, more pleasant colors, and typography that looked more professional.
None of the earlier versions of my portfolio were responsive, though I did make sure they at least looked reasonable on mobile (hence the single column design). With this redesign, my goal was to create a site that actually looked and worked great across all viewport sizes.
Another goal was to get serious about the visual design. I wanted to celebrate typography (and I surprised myself with what I could do with Arial); be thoughtful and rigorous about proportion, spacing, and color; and create a design that both reflected my personality and was accessible to a general audience.
From the standpoint of the user experience and information architecture, I also wanted to design something flexible, that allowed as much room as I'd need for all the content (the earlier versions were sparse on content because the design didn't accommodate it very well), and also allow the user to stay oriented in space with a navigation system that felt like moving through different sections of the site rather than simply scrolling and scrolling... and scrolling.
These are websites I designed for the various internet comics I've created. The basic goals of any site like this are to showcase the comic, and to provide easy navigation through the archives.
My most recent comic site design was for Karate Homework. When I designed this site, I put a lot of thought into the user experience.
One big change I made to the layout for Karate Homework in comparison to most comic sites was to move the header down below the comic. The idea was to really put the comic itself front and center.
Another problem I sought to solve was helping the reader to know where they are at any given time while navigating the archives. For most comics, you have to look at the address bar of your browser, which usually gives either the title of the strip or its sequential number. Neither of these gives you what you need to orient yourself. My lightweight solution was to simply provide the current number of the strip you're on out of however many have been created so far. That way, you know if you have 20 more comics to get through or 200.
Finally, I took a page out of Tumblr's book and added a tag feature. The key here is that I make sure to tag every character appearing in a given strip so the reader can easily find every instance where, say, George Washington shows up.
Visually, for Karate Homework the bright colors and glitchy aesthetic are intended to help the site stick in a reader's mind, and reflect my own personal aesthetic sensibilities, since the site is somewhat of a catch-all for my creative output.
For Creep House, I went for a hand-drawn, creepy Halloween style.
Thinkin’ Lincoln's visual design is meant to evoke US currency, since most of the characters in the comic are featured on money in some country.
These are a few of the sites I designed earlier in my career. To be honest, I'm not super proud of them from a visual standpoint, but I'm including them to give a sense of how long I've been doing web design.
When I worked in web marketing, I would often design landing pages — single page websites focused on one very specific goal. Part of landing page design included A/B testing and tweaking the designs based on that data.
I'm proud to say I got quite good at designing landing pages. The first design below, for example, achieved a 25% conversion rate, meaning one in four people who looked at the page signed up for a class. A rate like that is pretty unheard-of in web marketing circles.
I also have experience designing banner ads, email newsletters, and other similar web marketing materials. However, it's been several years since this was part of my daily work.
While my design focus has largely been in digital media, I have done a number of small-scale print projects. So I'm somewhat familiar with things like bleeds, working in CMYK, paper weight and size, etc.
posters for microsoft
Microsoft hosts internal events all the time, and for a number of these, I've been asked to create the posters to promote them.
I've created many print materials for HiveBio as part of my work as creative director.
For the last 6 years, I've worked at Microsoft on Windows Phone, Windows, and related websites. In addition to working on apps and sites myself, I've made it easier for the people around me to make things by building reusable templates for designers and shared libraries for developers.
I own the shared styles, controls, and components used on these sites. My team takes requirements from the design team, builds them out and tests them, and then works with the engineering teams to implement the styles to match design's specifications.
When I worked on the Windows team at Microsoft, I led a project to create system controls and patterns in Adobe Illustrator and in PowerPoint. The goal was to help designers save time and effort by providing them with pre-made building blocks. Another big benefit was that this approach helped to maintain design consistency across the organization.
I was also responsible for two first-party apps for Windows 10, Microsoft Edge, and the Maps app. I worked closely with the design team to make sure what they handed off to the engineering team was vetted for things like accessibility compliance, localization readiness, and a responsive design that was feasible within the Windows app framework.
In terms of building these apps, I oversaw the design developers who worked on the UI.
I started working on the Windows Phone team just as the transition from Windows Mobile to Windows Phone 7 was happening. It was exciting to be part of the move to the Metro design language, which was a breath of fresh air at a time when smartphone interface design was trending heavily skeuomorphic.
In my time on Windows Phone, I worked on almost every part of the UI. The major areas I owned over the years were the SIP (keyboard), the Messaging app, and Cortana.
soft input panel
SIP is the term for the on-screen keyboard and related input methods used on smartphones. I worked on the SIP for Windows Phone, polishing the UI across dozens of languages to pixel perfection.
As the Windows Phone OS added support for more and more languages, the code for the SIP became more and more complicated and fragile. To solve this, I worked with the SIP engineering team to re-architect it so that it was more flexible and allowed precise control over keys and keyboards for 50+ languages.
Cortana is Microsoft's digital personal assitant. I worked on the Cortana app when it was first being created for Windows Phone. Now, Cortana has spread to Windows 10 and Xbox as well.
For a long time I worked on the Windows Phone Messaging app. Messaging is a surprisingly complex app with a lot of different possible states and configurations. Messages with images, links, audio files, group messages, messages with or without a title, messages in different languages, etc, etc. At the time, the app even had an entirely different layout for certain East Asian locales.
As the design developer, it was my job not only to polish and test the app in all these different configurations, but also to help the designers to understand them and the limitations of the implementation on what was achievable in the design.
other stuff I've worked on
My history making websites goes back more than 12 years. I started building simple HTML sites all the way back in middle school, but I've been doing it professionally since shortly after I got out of college.
I've learned the quirks of different web browsers stretching back to IE6 (and IE 5.5 for Mac), contended mightily against the constraints of HTML rendering in email clients, worked with all sorts of content management systems (Movable Type, Wordpress, Drupal, etc.), used many different types of source control (CVS, Source Depot, TFS, Git), implemented style libraries like Bootstrap and Foundation, built out sites using templating systems like Handlebars, and learned the joy of CSS preprocessors like Sass.
During my career, I've built things for myself, built things for freelance clients, worked in an agency setting, and for Microsoft I've made things both to be shipped to a billion customers and for use only by internal teams.
For me, it's hard to beat the satisfaction of getting my hands dirty, fighting through the challenges and obstacles that always come up, and finally seeing something I made myself standing on its own, looking beautiful and working exactly as I set out to make it.
I’m an artist.
I'm passionate about creating art. If I go too long without creative expression, I'll often find myself lying awake at night with ideas racing around in my brain, unable to sleep until I at least jot them down.
As a cartoonist, I love to draw and to write jokes. As a novelist and writer, I'm interested in both long-form novels and short stories.
Thinkin’ Lincoln was a comic I made from 2005 to 2009. I wrote and drew a new Thinkin’ Lincoln comic every weekday, more than 900 strips in all.
It's a little difficult to describe the premise of the comic, but it was basically a comic where Abraham Lincoln's floating head talked to the floating heads of other historical figures and animals and... other stuff. It's supposed to be funny.
Karate Homework is my current comic project. It features new Thinkin’ Lincoln & Creep House strips, as well as a hodgepodge of one-off, unrelated comics.
This project started with a few doodles on Post-It notes in a conference room at work. I drew some monsters with funny quotes on them, and people seemed to like them, so I kept drawing more.
As of this writing, I've now drawn nearly 500 monsters. I hope to make a book out of them in the future. Here's a small sample of what they look like.
forum avatar project
As a fun project, I once offered to draw avatars for members of an online forum I used to frequent. I ended up drawing over 70 absurd little illustrations for people on the internet.
I drew each of them digitally in Adobe Flash, using my Wacom Cintiq.
Username: A Bear
Username: Baron von Swede
Username: Beautiful Chaos
Username: Boorishly P. Foundry
Username: Captain Lazers
Username: Death By Chiasmus
Username: Dr. Mr. Vandertramps
Username: DTZ Reunion Tour
Username: i invented rain
Username: karma repair kit
Username: King Carl
Username: Love, Your Third Daughter
Username: Lupus Gene
Username: Mafia Tipster
Username: Randy Johnson
Username: Raziel Lafleur
Username: SNARK! (boojum?)
Username: Stranger Dan
Username: Tall Count Orca
Username: the baber
Username: The Ghost of Jizzbird
Username: the saturday option
Username: Thomas James
Username: Tom Meade
Username: what steam is
I have designed many shirts for my comics, as well as for teams at Microsoft. Traditional screen printing gets more expensive and complicated the more colors there are in the design, so the medium encourages the artist to make more with less.
Here are a few of my favorites.
In addition to years of writing comics, website copy, and many many emails at work, I also like to write novels and short stories. Sometimes poetry too, but I wouldn't claim any special talent in that regard.
I love unreliable narrators, magical realism, and experiments with the narrative form.
I am currently shopping my first novel to literary agents. It's called Yaganishna, and it's about Baba Yaga, the witch from Russian fairy tales, and a failed novelist named Ivan Broom. The novel follows the rise of the wicked Baba Yaga, the fall of the downtrodden Ivan Broom, and it's interspersed with fairy tale stories from Baba Yaga and excerpts from Ivan's many books.