Archive for the 'Micro-ISV' Category
Red 66 Logo Design Thursday, February 8th, 2007 by Mike
In mid-2006, Carlos Granier-Phelps contacted me at MakaluMedia, about designing a new logo for Red 66, his consulting business focusing on Web 2.0, usability, Internet video technologies, digital security, ratings analysis software for TV stations, and web/tech consulting for movies & TV.
I worked with Carlos to gather my standard information package his company structure and outward image goals, his likes, dislikes in color and design and other tidbits that would give me insight in the sketch stage of the project.
Carlos wanted the logo to embody many different aspects of his personality and his business, including: hip, clean, dynamic, safe, fun, global, innovative, and high-tech. Quite a challenge, but I felt confident that by working with Carlos through the normal sketch to final process, we would find the right solution.
Sketches
First, I brought out the trusty Miquelrius sketchbook and pencil, and began capturing ideas as they came to mind, after reading Carlos’ notes. Below I’ve posted thumbnails of complete sketches and artwork: click each image to see a full version:
Here you can see I explored a wide variety of ideas, playing with the interesting shapes created by dual 6s. I felt drawn to circular shapes enclosing or working with “66″, as 6s are organic and round.
Carlos quite liked idea 27, since it seemed to capture Route 66, which was a positive thing in his mind, yet had a clean, simple look he was aiming for. He also liked 16 and 18, and oddly enough, liked the 2 Route 66-style ideas below 5 and 6, which I hadn’t even highlighted on the page!
So, after some discussion, I prepared a second set of sketches, focusing on the narrowed field of ideas.
Here you can see the Route 66 approach expanded greatly, along with square idea 18 and the circular idea 27 from the first round of sketches.
After review of the second set, and my suggestions to lean toward 9, 10 and 7, Carlos settled on these ideas to prepare black and white concepts to narrow to a finalized design.
Black & White Concepts
This is a very critical phase, where my rough concept sketches are turned into production quality art. It is here, where a mark is proven to work, or not work in the simplest form possible — black and white. Often, this is the moment where an idea tends to shine and separate itself as the right solution, or fade as an also-ran. The Red 66 logo project was no exception, as the circular concept 9a immediately and clearly step out front as the winning black and white mark.
Color: Round 1
Outside of coming up with ideas, color can often be a tough stage. Colors are often emotional, which is why I like to have a solid black and white logo selected before moving to the color application phase. 
On set 1, I explored a variety of color combinations, taking into account Carlos’ location in Miami as one aspect of color influence.
Color: Round 2
Based on this round we wanted to refine the color selections a bit more, to include brighter colors and explore reds and burgundy colors with similar tones and contrasting choices, like blue-green, orange and teal.
At this point, both Carlos and I honed in on idea 8.3 as our color winner. It had the nice light/dark red tones to reinforce the “red” theme, with a secondary Miami-influenced, cool retro blue-green outer ring for contrast. It had a muted, yet strong overall feel that we both liked.
Conclusion
Since creating the new mark, Carlos has applied it to his blog, and other materials. I’m very pleased with the simplicity and cleanliness of the Red 66 logo — it’s organic and smooth, yet has a hint of hip retro Miami.
Thanks Carlos for working MakaluMedia and I on your new Red 66 logo!
CGI Interactive Logo Design Thursday, October 26th, 2006 by Mike
Last year, after Paul Bradley came across Ian Landsman’s Creating a Business Logo article, he asked if we could design a new logo for his company, cgi Interactive. One of my passions as design director at MakaluMedia is logo design and corporate identity, so I was excited to take on the project.
Paul’s firm. cgi Interactive, is a software development company based in the North West of England, who develop custom web based applications for businesses. The CGI moniker had its touch-point in the Common Gateway Interface (CGI) programming done for clients in the early days of the Internet.
Paul wanted to maintain a connection to the past by keeping the CGI name, while coming up with a strong, clean logo to represent his company, on both the web and with other print materials (letterhead, envelopes and business cards).
Questions & Research
I started as I always do: asking questions of Paul about his company, goals, taste and thinking and doing my own gathering of information about the company. While it might seem trivial, the information gathering phase is critical — these are the words I ponder, as I prepare to sketch logo concepts that capture the company in a simple, iconic form.
From my initial research, it seemed the logomark should be simple and clean, yet still have a bit of a human touch, as Paul mentioned a history of “bespoke” or custom software development.
Sketching Ideas
As I sketched ideas out, I began focusing on a mark made of the letters C, G and I — using them to form a compact object.
Rounded letter-forms turned into squared letter-forms. I liked the idea of the C wrapping itself around the I to form a “G” at the intersection. To reinforce the “I” character, I used a lower cased variation to take advantage of the dot.
Black & White Explorations
We both liked this direction, so my next step was to jump into Adobe Illustrator and create the letters in black and white vector form, where I could explore the relationships of the C, G and i elements:
Notice how the horizontal stroke of the “i” character extends into the counter of the capital C character, to form a G. Then, the dot of the i character fills out the upper right corner of the mark. I like creating logos in black and white first — to assure they work well in their simplest form.
The mark also created an unintentional, yet nice side effect — notice the appearance of of a person on the right, extending an arm into the C, with the dot of the “i” acting as the head? What a nice coincidence!
Color Explorations
Next up was the color phase, which was quite straightforward, as Paul knew he wanted cool blues and greens used. I explored some complimentary warm colors with the mark, but we kept coming back to a combination of dark sea green and a sky blue to capture a solid, professional feel:
Notice also the font used is a Myriad/Gill Sans blend with a little custom tweaking done on the letters. The “cgi” text was kept in the sky blue, and “Interactive” stayed in the dark sea green, corresponding to the colors chosen for the mark.
Paul was very pleased with the final logo design. He felt it captured the professional look he wanted to portray, yet still maintained a human touch, to represent the custom, collaborative projects cgi Interactive does. I had fun working on the logo design, facing the challenge and seeing a unique mark emerge from the letters themselves.
Since designing Paul’s logo in 2005, we’ve had many interesting and challenging logo projects come from new and existing clients, keeping me happily busy doing what I love — logo design.
If you like this approach to logo design, and need logo or corporate identity design work, just drop me a line and let’s talk!
StreamerNet Icon Redesign Friday, July 7th, 2006 by Mike
About a month ago, my good buddy Michael Ashby came to me with an icon redesign project for the startup company called StreamerNet.
StreamerNet provides individuals and businesses with a variety of very powerful portable streaming services and an application for the PC called StreamerNet Mobile Video Producer. Both their application and services make heavy use of advanced Windows Media features.
StreamerNet wanted to have their original “galaxy” of icons redesigned, with a smoother, more sophisticated and more consistent icon style across the suite. There were also a few changes needed and one new icon to create.
Here are the original icons:
One of my main goals was to clean up the icons and simplify them as much as possible. The icons above have quite a bit of detail in them, though so small that much of it was getting lost, and not clearly suggesting the purpose behind each icon.
I began with the Video Email icon first, establishing a style with sketches, then producing a final icon for approval by the client. StreamerNet liked the first icon’s style and look, so I continued on the other icons.
Because of a tight timeframe, I did sketches for my own concepting, heading directly to final art in Fireworks once I was satisfied with the concepts. There were of course a few tweaks to make on the final art, though not very many.
Here are the final icons:
As you can see, the new icons are a little bit larger, and more consistent in style than the originals, while being a little simpler and clearer. I think the added depth of the new icons also helps them pop off of the screen a bit better than the originals.
The icons are now in use on the Solutions page, as well on the headers for each sub-page linked to the icons, and will most likely be used in the StreamerNet Mobile Video Producer application.
I’m very pleased with the final icons. I think they help tell the story of StreamerNet in an attractive, consistent way, while maintaining and clarifying the original concept.
MakaluMedia Corporate Identity Portfolio Monday, May 15th, 2006 by Mike
Since the end of 2004, I’ve been actively pursuing corporate identity design through the company I work for, MakaluMedia.
The first in a long line of logos was created for Ian Landsman, his firm UserScape and his first product, HelpSpot. In fact, Ian wrote the post Creating a Business Logo back in January 2005, describing the logo design experience from his perspective.
Since the that first web 2.0 logo project, and having been featured in Bob Walsh’s Micro-ISV book, I’ve been receiving many requests to help companies and individuals design their corporate identities. It’s been wonderful helping create clean, clear and effective logos for each one of our clients.
Last week I realized we had no central page on the MakaluMedia site, where logo or related information could be viewed. This week I’ve created a new page where you can view a select collection of logos case studies:
MakaluMedia Group Design Portfolio: Corporate Identity
The portfolio explains why Makalu’s logo design process is different, along with 4 case studies and images of completed logos. My goal is to continually expand this portfolio page, making it a handy reference for anyone seeking to learn more about our logo design services before they hire us.
I still intend on going in in depth on the design process for logos I create on the Rohdesign Weblog, as I’ve done for the Outer Level and LiquidFitness logos. I enjoy sharing my thought process and more detailed sketches on the weblog. From the comments I’ve received, readers enjoy it as well.
I’m hoping the two pages will compliment each other nicely, with the MakaluMedia Corporate Identity page providing the overview of each logo design, while the weblog can offer richer details, sketches and the thinking behind each design.
Designing the endo icon Saturday, March 11th, 2006 by Mike
I’m very excited reveal my latest new icon design for endo, a syndicated feed reader developed by Adriaan Tijsseling. This new app approaches syndicated feeds as “streamsâ€? rather than the common “email appâ€? approach most aggregators use.
The icon was developed in collaboration with Adriaan, the developer of blogging tool ecto and Flickr stream manager 1001, which I’d designed the icon for last year. While we worked out the new icon, I’d been under an NDA with Adriaan (as design director at MakaluMedia) but since endo has been released, I’m free to share. :-)
(Click on graphics below to see full sketches)
Initial Concepts v1
I began the project by writing out thoughts and sketching some initial ideas, and having designed the 1001 icon,
felt that the icons might benefit from having a “family� feeling between them. So, when you look at the initial v1 sketches I did, you can see this quite clearly.
While the final icon veered quite a bit from the initial sketches, I like to point out that very often a designer must work through what is in their heads in order to progress to the next step — a bit like flushing out the immediate ideas to get at the deeper ideas.
Sketches v2
In the second round of sketches, I began exploring the idea of different shapes, 
shapes breaking planes and swirls of data surrounding shapes. As endo was to be different than other aggregator/readers because it treats feeds as “streams� I wanted to convey the idea of a stream of data — as chaotic swirl or plane.
While breaking a plane was an interesting concept, the more chaotic swirl appealed to both Adriaan and me, because it felt much more like the real net, with wild streams of feeds spinning out of control. Endo was to be the calm in the midst of this storm of data; helping its users wade through this swirling cloud.
Sketches v3
In my 3rd revision of sketches, I focused entirely on the idea of a swirling cloud of data, 
surrounding various shapes. You can see in the larger sketch that circular swirl with a central “hub� containing a magnifying glass at the center of the swirl. This represented the application at the center, filtering good signal from the noise. These concepts were attractive to both Adriaan and I, though we both wanted to see one more round to finalize the concept before I went to Fireworks and Photoshop on the Mac.
Sketches v4
In this round, Adriaan had the idea to include the newly standardized Feed Icon, which is already used in 
Firefox (and will also be used in IE7), so I tried several icons with the Feed icon integrated. I tried a variety of angles, until in sketch E you can see the idea of having the feed icon appear in the central hub and also appear in the shadow below, since the central hub would be transparent (like a marble).
Once Adriaan and I saw sketch E, we were both in love. Adriaan gave the Ok to move to the Mac, and there, the new endo icon was born, using Fireworks to build the icon (with vectors and layers) and then exported in Photoshop, using the excellent IconBuilder 8 from IconFactory.
Only minor tweaks were needed to finalize the icon on the Mac and deliver the needed icon, and source files Adriaan needed to spruce up his endo application and the new Kula website.
Conclusion
I’m very pleased with the new endo icon; it’s simple, different and I think conveys the concept of a feed aggregator sifting signal out of the syndication noise — just the idea Adriaan was trying to convey with his very different application. One commenter on the BWANA Weblog suggested the endo icon “has the best application icon since Shiira.â€? which was flattering indeed. :-)
Thanks Adriaan for trusting in me to help on this project and all of his excellent collaboration. Working on this project was truly a pleasure!
If you’re on Mac OS X and want a alternate way of deal with feeds, try out endo. It offers a very different approach, which may just suit your needs.
MakaluMedia Book Appearance: Micro-ISV: From Vision to Reality Monday, January 30th, 2006 by Mike
Today I received a wonderful gift from the UPS delivery-man: 
a crisp edged, brand-spankin’ new copy of Bob Walsh’s Micro-ISV: From Vision to Reality softcover book. Why is it so special? Well, it’s the first book in which I’ve been featured as an interviewee! (see pp 58-59)
Bob emailed me last summer, asking if I’d be willing to offer quotes on logo and graphic design for his new book, to which I heartily agreed. After all, I’d been collaborating with Ian Landsman and several other micro-ISV owners on logo and web design work, so it only made sense to share that experience with Bob and other Micro-ISV owners. (Micro-ISV stands for micro-Independent Software Vendor; in other words a small software developer, often one person.)
Bob called a few days later to ask his questions and discuss the details. We had a great phone conversation, which eventually turned into a post on his ToDoOrElse weblog, as Micro-ISV Tip #6: Visual Integrity.
Here’s a snippet from the article, which ended up in the book as well:
Q. Why should a micro-ISV get a professional in to do their logo?
A. There are certainly ways of doing it yourself, or buying an off-the-shelf stock logo for fifty bucks, with exclusive rights in the 200 dollar range. Problem is, if you have a very specific company and you’re looking to portray what your company stands for, you’re already adapting to an existing logo that may not fit what you do. You’re already starting off with a compromise.
It’s subtle, but because it’s important to get the idea of your company or product across quickly and fully. Any confusion or lack of clarity can delay the first good impression. Design is becoming more and more critical for businesses, particularly on the Internet where you see the identity long before connecting with a person.
In a nutshell, you should hire a design professional because is it’s not your specialty. If you’re a micro-ISV, you’re always trying to be very effective with your limited time and energy. By doing it yourself you may actually spend more time and energy than you want and yet may not be happy with the end results.
All those months ago, I hadn’t considered the reality of my words and name being captured in print. I’m quite used to seeing my words appear online — on my own blog and even on other websites — but there is something special about appearing in print. it’s so… permanent.
Many thanks to Ian Landsman, and his UserScape and HelpSpot logo blog post which opened which the door for this opportunity, and to Bob Walsh for giving me the opportunity to contribute. I hope my words help many more Micro-ISVs out there establish businesses with great design as one of the pillars of their success.
Outer Level Logo Design Tuesday, January 17th, 2006 by Mike
I thoroughly enjoy logo design work, so when MakaluMedia clients talk about their experience in the logo design process I’m always interested. Just yesterday, Jon Trainer of Outer Level, posted a detailed article describing his experiences of collaborating on a logo design with me. Jon develops applications, including the game Bullfrog and the utility License Keeper for Mac OS as well as software development consulting.
I thought it would be interesting to quote some of Jon’s post here and provide my own thoughts.
Keywords and Goals:
Thankfully, this is where Mike comes in. Something I didn’t think about prior to hiring Mike, but would recommend to anyone looking for a graphic designer, is that you look for someone who can “consult” with you on your image. Instead of just asking what I wanted my logo to look like, Mike sent a short list of questions to solidify his feel for my tastes, personality, and desired company image.
One thing I’ve found helpful is to describe goals you’re shooting for when designing a logo. What kinds of feelings should it evoke in a viewer? Should it convey strength, warmth, honesty? While these might seem to be nebulous words, I think setting goals in words helps clients and myself get focus before the sketch process even begins.
Dead End Ideas:
A little over a week later, Mike sent me two full pages of pencil sketches incorporating my descriptors and his own feelings from the Outer Level name. Some of his ideas reflected ones I have had in mind for years — probably the more obvious and common images that Outer Level brings to mind. These are precisely the ones I didn’t want. I was looking to avoid the common and the obvious. Also in the sketches were some ideas that immediately captured my imagination.
Lately I’ve found it good to go down the ‘obvious’ paths to prove that the idea either has some potential — or that it’s a complete dead end.
Leaving ‘dead end’ ideas right in my sketches, while clearly explaining why they are dead ends to my clients helps cleanse the dead end idea out of the system, allowing me to try other areas of exploration and “let go” of the dead end idea.
There is of course, a risk a client will like a dead end idea. However, because I always provide comprehensive explanations with my sketches, I’ve found clients trust my judgement when I call out a dead end.
Client Collaboration
There were many bits in these sketches that I really liked. So I sent back my comments along with my own sketches because I tend to think better in pictures than in words.
When Jon sent me his sketches I was very excited to see him getting into the process so deeply! I’m a proponent of visual thinking, so seeing my sketches encourage a client to sketch was wonderful to see.
Color
To this point, the process had been quite fun, though challenging. I had no idea what was in store now that it was time for color. I envisioned blue, red, and even green as potential main colors and wasn’t surprised that I wasn’t alone in this train of thought.
Color is maybe the toughest part of the logo process in my opinion. Colors carry have emotional impact, which is why I like to leave color to the end of the process — this helps void choosing a logo based on the color rather than a great concept.
Unfortunately, once I saw these colors applied to the logo design they didn’t project the feel I was looking for. But, I really liked the warm red-orange sunrise-like background Mike had incorporated. So I searched out some photos of planets, nebulas, etc. and sent them to Mike as a sample of colors that appeared in space. Maybe, these would help change the feel of the logo.
As it turns out, these “space colors” lead us in the right direction.
It’s rare to nail down final color selections on the first round because color is so complex. This is why it’s so important to collaborate with clients. In this case, Jon sent some reference to give me an idea of his tastes, from which I was able to draw out some new options.
The entire process really is a back and forth; client feedback and my expertise, combined to arrive at a final logomark that’s attractive, practical and pleases both the client and designer.
What intrigues me is how fun this process can be, particularly for clients. All of the clients who have collaborated in their own logo process have commented on how much they enjoyed it. Knowing clients get a logo they love and a process that’s fun makes for a very satisfying experience for everyone.
If you need of a logo and are intrigued by this design process, drop me a line.
Kula 1001 Icon Monday, January 24th, 2005 by Mike
Received good news on Sunday night! Adriaan Tijsseling, the author of blogging tool ecto, dropped a line to tell me my new icon for 1001 (a Flickr photo stream management tool) was used on his latest beta. Alright!
I’ve been a user and fan of ecto since June, so when I learned via Michael Ashby that Adriaan was looking for some icon and design help with ecto, I dropped him a line. As it turns out, Adriaan found help with the ecto project with designer Neil Dixon. However, he was also in need of a new icon for his 1001 app, a tool for viewing and managing your own and others’ Flickr streams. I felt honored to be offered the opportunity, so I immediately agreed to take on the project through the company I work for, MakaluMedia.
So, I began as I usually do, with sketches in my Miquelrius sketchbook. The concepts were scanned and emailed to Adriaan for review. The process went quickly, as one of the concepts in my sketches — an earth with photo streams wrapped round, being viewed by a loupe — resonated with both of us.
From there, I began the icon construction process. At first I tried to sketch the sphere with streams wrapping around it, but soon realized it would be difficult to get right without good reference. The next day I had an idea in the shower — why not wrap strips of paper with black photo blocks printed on them around one of Nathan’s kickballs?
So that’s exactly what I did — and it worked perfectly! The strips provided a perfect template for re-drawing in Adobe Illustrator. I then copied the vector art from Illustrator into Fireworks, to add color and paste photos into the stream blocks on the globe.
In fact, if you look very closely at the pics on the streams of the final icon, you can make out shots of Adriaan, his friends and several of my own family. It’s always fun to see the icon, because even though the little pixelized photos are obscured, I can still remember the moment when each family photo was taken.
I had a blast working on this icon. It always feels great to see a project like this come together, especially when the process leading up to the final art was so much fun! :-)
Thanks Adriaan!
MailDrop 2.0 Icon Story Tuesday, December 3rd, 2002 by Mike
Okay everyone, time for a little horn-tooting PR for a “design the iconâ€? contest I won on November 18th. I think the busyness of the season and Thanksgiving holiday threw me off, because I’d intended to mention this sooner. :-)
Anyway, Matt Henderson, the owner of MakaluMedia (the company I’m design director for), alerted me of an icon contest being offered at Erik Barzeski’s NSLog weblog. Erik runs Freshly Squeezed Software, makers of various Mac OS X applications, including a Mail Merge app called MailDrop. It turns out that MailDrop is being updated to 2.0 and was in need of a new icon.
Well, I figured what the heck. While I have 15-some years of graphic design experience, I’ve never done a Mac OS X icon before. I thought this project could be fun, challenging and educational. Better yet, the icon concept they were looking for was somewhat cartoony, and hey, I love cartooning. So I took on the project.
Erik liked the direction in my sketches and rough icon ideas, so I proceeded with the icon project and ended up winning the contest. The final set of application icons are posted with this article. We’re still in the process of finalizing the app’s document icon.
My icon building process took a little time to sort out at first. I ended up working in Macromedia Fireworks, because I could use vector art, yet see immediately how my changes would appear in pixels. I also experimented with Adobe Illustrator and Photoshop, but because of my daily use of Fireworks and its vector/pixel feature, it just suited me best.
Once I had a final icon, I exported a master PNG file with transparency. Then I opened the file with Photoshop 7 for conversion into icons using a handy Photoshop plugin from IconFactory, called IconBuilder. At $69 It’s not cheap, however, for the time it saves doing icons, I can see its value. I love that IconBuilder has no use restrictions (other than a nag screen which appears after multiple uses), because this allowed me to fully test it out before we decide to purchase it.
If IconBuilder is a little too high for your budget, there are other free and shareware tools out there, like Icon Composer (included with the Xcode Tools on the OS X developer CD) or the $15 shareware tool, Iconographer.
Should an icon for OS X be in your future, check out these helpful Apple documents: Icon Genres and Families, Suggested Process for Creating Aqua Icons, and Tips for Designing Aqua Icons. Here’s another useful reference: OS X Icon Tutorial from O’Reilly’s MacDevCenter.
Overall, it was a great challenge, and indeed, very educational. In fact, it felt very good to dive into something I’d never done before!
Ok, here’s my final PR spiel for this Friday: If you happen to need a little icon work or any other type of design work (web or print), please feel free to drop me a line. :-)
Have a great weekend!