What happens when an Apple guy explores Material Design?

He may or may not upgrade his design style to awesome!

Matt Delac
UpLabs Success Stories
8 min readJul 1, 2015

--

What makes Material Design so incredibly attractive is how smooth and straightforward it is to get started and explore possibilities it has to offer with app, animations and even site design. The pace at which the Material Design trend is growing is a tribute to that, and pretty soon we’ll start seeing bigger companies turn to Material Design.

At least that’s what Jurre Houtkamp seems to think, a talented designer from the Netherlands who used to believe that all good design and user experience comes from Apple. Quite the 180º turn! When exploring Material Design, Jurre took upon re-designing well-known icons, starting with Slack, and the result is quite astounding. So we interviewed him to understand his approach and creative process when creating icons using Material Design.

Hi Jurre, can you tell us a bit yourself and how you became a designer?

My name is Jurre Houtkamp I am a 20 year old dutch designer based in Amsterdam, The Netherlands.

There have been only two moments in my life when I really knew what I wanted to do when I grew up; at the age of five when I was certain I was going to be a policeman, because that way I couldn’t get any speeding tickets. And when I landed my first internship at an app and web development company. From that moment on I knew I was going to be a digital designer focused on user interfaces for apps and website and the branding behind those.

Three years later I spawned a company named Cabarera with two good friends who are both extraordinary in their own way. We make up a solid team with a wide variety of skills ranging from web design to Illustration and branding. In September I plan on starting another study in the field where I’ll focus on Front-end development, motion design, User Interface and User Experience design. Just because I can’t get enough.

A life without speeding tickets still sounds very tempting, so if none of this works out I can still pursue my five year old self his dream and become the fanciest looking policeman with custom badges all over his uniform.

That’s a cool backup plan! So what first attracted you to exploring Material Design?

I have to admit I’m an apple guy and up until about a year ago I had no attention for Google or Android whatsoever. I saw parts of Google’s I/O when they first introduced Material Design but I had been so disappointed with Android that I didn’t put in the effort to actually understand what Material Design was. A few months later a lot more Material centered posts started to appear on Dribbble, and then it hit me; this not only beautiful but also genius and game-changing.

So as my 15 year old self would do I started to experiment with Material Design and read up on about everything Material Design related. First I tackled the app/web interfaces and soon the corresponding icons and animations followed.

Google won me over and in my eyes they finally understood what the user want: visual feedback, and that’s all Material Design is about.

Finder icon, by Jurre Houtkamp

I used to look over android users’ shoulders on the bus and laugh at their clunky phones running a half-assed operating system. Nowadays I look down at my iPhone wondering why I’m still not rocking newest Google Nexus with Material Design dripping all over it.

And where do you get your inspiration?

My biggest inspiration has been Dribbble for a few years now. I love getting up in the morning and browsing Dribbble for the next hour only to find myself planning my next upload for the next three hours. There is no better way than learning from the best and it’s definitely the place to find the best. It has led me to getting some of the best instant feedback I have ever had, and it’s also very motivating when you instantly see the likes and views pop up when you post something you’ve been working on for weeks.

Besides Dribbble I’ve recently added MaterialUp to my morning routine for my daily dose of Material Design sweetness.

MaterialUp App Icon, by Jurre Houtkamp

I keep discovering new people everyday who are brilliant in their own way, but to name my absolute favorite it would be a fellow dutch designer based in San Francisco called Sebastiaan de With from Pictogram Agency. Not only his work but also his entrepreneurship has been a great inspiration to me. His icon pack called ‘Muir’ actually inspired me to make one of my own.

We really love your redesign of of the Slack icon. What’s your creative process?

‘A spark of genius’ thats what a friend keeps saying when something pops into his head and he just slaps it together in Photoshop in a few minutes. It’s one of those precious moments when the stars align and everything seems to fall into place. I’m not insinuating that I’m a genius but I do get these special moments where my IQ peaks above 20 and I don’t feel like a caveman drawing up the latest animal he saw. The Slack icon redesign was one of those moments. I came across the Google chrome icon and noticed it had a lot in common with the Slack icon.

So I decided to give it a go and Materialize it. This made me go on a two day design spree where I tackled almost every icon in OSX and rebuild them from scratch.

The Slack Icon by Jurre Houtkamp

Some of them hard, some of them ‘Sparks of genius’ like my friend says. I don’t think there is a standard process to the way I work. I’m all about doing and figuring it out on the go, it’s the best way to learn because you fail a lot.

Absolutely, don’t be afraid to fail because that’s the only way you’ll become original. What tools do you use?

As a passionate User Interface designer I had to get Sketch. I never really looked into Sketch because I felt like Photoshop could handle everything I did. But Sketch to Photoshop is like getting your first Apple computer after you’ve been messing around with Windows since you were a kid, you don’t get it until you use it.

Of course Photoshop and Illustrator have been and still are my go-to-guys for the past few years now. Illustrator mainly for iconography and logos, and Photoshop for about everything Sketch and Illustrator can’t solve.

I’m always open to trying new things and as long as it works, looks pretty and is not Windows exclusive I’m down to get dirty.

How do you choose colors?

When designing something Material style there are clear guidelines set by Google on what colors are fit for the style and I try to stay with those colors. I usually use an online palette like Material Palette to quickly find the right combinations and color codes.

When it comes to designing anything else my eyes usually serve me right. When designing for a client for instance colors usually come to mind during the design process because of how the product they want makes me feel or how they want it to make others feel.

Photos Icon in Material Design, by Jurre HoutKamp

What is the biggest challenge you’ve come across so far?

My biggest challenges have probably been getting stuck on a design. Whether it’s a simple icon or a big complicated Interface for an app it happens all the the time.

Last time I got stuck was on some icons that are featured in the pack I uploaded, the Adobe ones, Photoshop, Illustrator and After Effects. The challenge was to keep the icons consistent and circular but simply adding the initials of the app to a colored circle didn’t quite do it for me. I decided to step away from them for a while and focus on other ones.

Material Inspired Icons by Jurre Houtkamp

So the best lesson I learned when that happens is to just put it aside for a while, work on something different or even better work on nothing and come back to it later. Most likely you’ll get inspired by your surroundings or by working on something else and you’ll be able to solve the problem with a clear mind the next day.

Besides that the main thing I do when I get stuck is browse the internet for inspiration, so thats what I did. Dribbble, MaterialUp even Google’s Material Design guidelines, I went through them all for several hours sometimes even days. In the end the solution was a very simple one but completed the icons in my opinion.

What’s your favorite use of Material Design for icons so far?

My favorite use of Material Design is probably the current inbox icon by Google. I’m sure this is also the icon that got me more interested in Material Design, the icon defines Material Design in every way and the animation work by Google’s John Schlemmer completes it.

Inbox by Gmail by John Schlemmer

Not to mention all the other work and his team have done at Google. Their animation work defines Material Design and it would be nowhere without it.

Google Calendar Animated Icon by John Schlemmer

Do you feel that Material Design will have a long term impact on how icons are designed?

If Google keeps pushing out Material Design to their products I think it’s here to stay. You see a lot of companies already adjusting their apps and icons to fit Google’s design aesthetics on Android and even iOS. And I think with Android’s current growing popularity this will only increase.

Every time Google or any other company updates their app to fit Material Design I get excited and can’t wait to use the product. I’ve seen friends and also big players make the switch from iPhone to Android because Android is no longer the clumsy ugly duckling in the pond. It has drastically improved itself with Material Design and I believe it will continue to do so.

There sure is a bright future for Material Design. Thanks Jurre!

You can follow Jurre’s work on MaterialUp, Dribbble and Twitter.

--

--