Meet Michael Matas. He's the graphic designer who helped Dan Wood create the great look for Watson and who's now designing for the Omni Group, as well as creating graphics and icons for other Mac OS X software developers.
Michael works exclusively in Mac OS X, and mostly in Photoshop 7. Oh, and one more thing, he's 16 years old and a junior in high school.
I learned about Michael through a conversation with Dan Wood at the Mac OS X Conference, and since then I have spent some time on the phone and iChat talking about designing good applications. We've put this interview together to introduce software creators to another resource to help them make their applications look as good as possible. Plus, Michael has a great story and some interesting opinions about application design.
Derrick Story: Hi Michael. Tell me a little bit about how you broke into the business of graphic design for software developers.
Michael Matas: Earlier this year while at MacWorld SF 2002, I was at the "Power of X" keynote. During the presentation they invited Dan Wood up on stage to show off Watson. I had never seen the application before. It was amazing but was definitely lacking in its icons. Based on the work I was doing on my own, I thought I could help out with its appearance. That afternoon I emailed Dan and asked him if he wanted me to help with the icons in Watson. At first Dan did not really like the idea--said he was just fine with what he had. So I went to work putting together a new version of his app icon. When I was done I sent it to him. That sealed the deal. He hired me to redo his app icon and his toolbar graphics for the next version. I still get emails from Dan asking for graphics for new tools and things like that.
|The Watson application icon is one of Michael's most recognized designs.|
DS: Sounds like Dan provided you with a great break. But you were already trying to get the attention of the people at Omni Group, right?
MM: Yeah, back in September of 2001 I was looking at the info panel in OmniWeb and realized that Omni was located in Seattle, my home town. I looked up the address, and sure enough they were about a mile from my house. I sent them my resume and waited. But I never heard back from them. A few months later while at MacWorld SF 2002, I spotted the Omni booth across the show floor. I went over and talked to Ken (chairman of the board) and told him about my living right by Omni and how I wanted to help out there.
He invited me to come down to Omni the following week when we were all back from the show. I went down to the Omni building after school, got the grand tour, and went up to the Omni ballroom to talk with Ken, Will (president), and Brian (tech support manager). I brought my iBook and showed them the small portfolio of icons I had done in my free time. Omni hired me, but not to do icons. Instead I was to do tech support. I started my first few weeks replying to hundreds of tech support emails about Omni's different products. I was soon tasked with creating some "lickable" vector palettes for OmniGraffle 2.0, Omni's charting and diagramming software. Shortly after that I was given the job of redoing all the toolbar icons in OmniGraffle 1.0 for 2.0. After that they decided they wanted me to spend my time with them working on graphics and marketing projects.
DS: That's cool. Kind of puts a whole new light on what you can accomplish at trade shows. Could you tell me a little bit about how you come up with your ideas and work them out?
MM: I always start on my white board. I try to come up with good and clear metaphors for the icon. I sketch out different ideas and usually end up covering the entire white board. When I do come up with a good metaphor, I then start sketching the layout of the icon and what angle I am going to draw it from. I go on Google image search and Watson's picture search and try to find good pictures for the object I'm drawing. I download anything that looks decent and open them all up in Photoshop. I create a new Photoshop file to draw the icon in and surround that window with the images I downloaded from the Web. I use the Web images to help me get an idea for what the texture and shape looks like. But if I can, I always try to look at real objects to get inspiration.
|The Move2Mac icon|
DS: It's an interesting creative process where you have such easy access to the images of others to help get your own juices flowing. Once again, the power of the Internet reveals itself. So, since we're talking tech stuff for a minute, tell me a little bit about Mac OS X, both from a personal standpoint, and from a professional perspective as a visual artist. I know it's a platform you prefer, which I think is great since I've heard many graphic artists tell me that they're not wild about OS X. Why do you like it?
MM: First off I am a Mac geek. The way I see it, OS X rules. There's nothing that even comes close to it. My hat is off to Apple for making such a wonderful operating system. When you're using OS X you really get the feeling that the people behind it have thought this stuff through and really did their best to make things work right. Not to mention all the beautiful UI, icon, and animations that make using OS X apps a lot more fun than any other OS. From a personal standpoint I really can't think of anything I am not wild about. Sure there are little features I would like to see here and there, but nothing that ever makes me nostalgic for OS 9.
From a professional standpoint my feelings on the subject don't really change. OS X's multithreading and protected memory have saved me incredible amounts of time and frustration. Now, when saving a huge Photoshop file I can go check my email or surf the Internet all while listening to iTunes. In OS 9 I would hit command+s and go make dinner; my computer would be unusable.
DS: Speaking of you using Mac OS X for your design work, what do you think of the Human Interface Guidelines? I've heard comments that they're too restrictive. But as a user, I like that continuity from application to application.
MM: I think the Interface Guidelines are great. Apple has some of the most talented designers working for them, and they know what they're doing. Just look at OS X: I think it speaks for itself. Overall I feel it's very important to have a fun and consistent experience as you go from application to application. That is the beauty of Watson, you do not need to learn a completely new way of getting information as you go from site to site. The information should be where you would expect it to be--the same place it was when using the last tool. It's the information that should change, not the tool.
With the guidelines in place, it creates a very easy way for everyone's applications to become far more intuitive and to give the users a more enjoyable experience. Apple isn't holding anyone at gunpoint here. You don't have to follow the guidelines. But I think when developers do follow them, their apps tend to turn out a lot better.
DS: I might be off base here, but it seems to me that this issue is one of the major differences between Mac and PC applications. To tell you the truth, I never really know what to expect when I launch a Windows program for the first time. Not true on a Mac, unless it's a "bad" app. As a designer, what do you think are the major differences between Windows and Mac apps?
MM: In general, when I look at a Windows program I get the feeling that the developer started off with a mile-long checklist of features and one by one checked them off. Then at the eleventh hour, slapped together an interface for those features.
As a user navigates through these cluttered and inconsistent apps, it must be real obvious to them that design wasn't a major consideration. These types of applications take a mile-long feature list and turn it into a mile-long tech support email headache. After all, if you can't find a feature in the UI, in reality it might as well not even be there.
In general, when I open a Mac OS X application that has followed the Aqua Human Interface Guidelines, I get the feeling that someone has really thought about how this program is supposed to work; where the features should be placed; and how the users workflow should happen. The bottom line is that Windows programs rarely give you the feeling of "Hey, that's how it should work," or "Wow, that was cool."
DS: So then, if you were designing for Windows applications right now, would you change your current approach? Or is creating a great look the same regardless of the platform?
MM: I think, regardless of the platform, there's a general underlining philosophy: users should be presented with a clean, fun, and intuitive interface no matter what kind of application you're creating. I think lots of developers building business software think that because they're creating software for "professional users," they should bombard them with every bell and whistle, because "professionals need the features!"
In reality, professionals need to get work done. They don't want to spend hours learning an interface that's packed with professional features they don't know how to use. Sure there are little differences in how you need to design an application depending on the platform you're working on, but at the end of the day, if your users aren't enjoying using your software, not much else matters.
DS: Hey, a little bit of a digression here, but I'm looking at some of these icon files you sent me. When I double-click on them in Preview, I'm noticing that the
.icns files have more than one image in the package. How does that work, and how do you save in that format?
.icns supports up to four different sizes of an icon image in one file: 128 by 128, 48 by 48, 32 by 32, and 16 by 16. There's a reason for this. When you're in the Finder viewing an icon at different sizes, it might look great at 128 by 128, but looks like junk when you're in list or column view. This format allows developers to create slightly different versions of the icon at different sizes to make sure users still understand what the icon is trying to communicate. To save into
.icns, I set aside
.tiffs of each size, then drag and drop them into IconComposer: the
.icns compiler that Apple ships with its Developer Tools. Then just save it out to the Finder.
|The layers palette in Photoshop with the Aizai TV icon open. This file has 100-plus layers|
|The IconComposer with the Aizai icon open. To create an icon, all you need to do is drag the saved .tiffs into the image wells, and the application does the rest.|
DS: These things are really fun to look at in Preview. It gives me a good feel for the different versions you have to create. OK, back on track here. When we were talking earlier, you told me that Omni Group is offering a new service to developers to help them integrate award-winning designs into their applications. Can you tell me a little about this service, and how interested developers can get in touch with you guys?
MM: Yes. Omni is launching an icon and user interface consulting service to help Mac OS X developers make their apps feel more at home on OS X. There are lots of programmers out there, but let's face it, not all of them are artists.
As Omni teams up with great developers and helps them provide their users with a better experience, we think the results are going to be awesome. We have a talented team here at Omni; the same one that helped Omni win three out of the last four Apple design awards for "Best User Experience." We're very exited about helping programmers incorporate great Aqua design into their OS X applications.
DS: That sounds great, really useful. I hope it all works out. Is there anything else you want to add that I may have forgotten to ask?
MM: Not at the moment. Thanks. Nice talking to you.
DS: Thanks Michael. I've learned a lot talking to you. Best of luck at Omni and with your other projects.
For more information about the consulting service you can send mail to Michael directly.
Derrick Story is the author of The Photoshop CS4 Companion for Photographers, The Digital Photography Companion, and Digital Photography Hacks, and coauthor of iPhoto: The Missing Manual, with David Pogue. You can follow him on Twitter or visit www.thedigitalstory.com.
Return to Mac DevCenter.
Copyright © 2009 O'Reilly Media, Inc.