“I have a fax from Sam for you.”

Those words struck fear into my heart. Sam was supposed to be on a plane halfway around the world. He wasn’t supposed to be sending me new things to do. Plus I was pretty sure that he didn’t even know how to work a fax machine. With him it’s iPhone or nothing. Here is what he sent me. It’s a little blurry but trust me, you wouldn’t be able to make it out even if it weren’t.

image

image

A bit later he attempted to explain his latest wild idea. The Enterprise Octopus had reared it’s head once again. It has done so several times. This time a new illustration was needed.

“I need you to draw the anatomy of the enterprise octopus with a bunch of people inside and you are on top with Doppler for a head. The tentacles are grabbing all this stuff. Then I need you to draw the octopus as bowl, upside down, with a man drowning in paperwork.”

Did I mention he was insane?

Fortunately at the time I had David Carroll working for me and he took the first stab at it. That’s what a good minion is for after all. David’s idea was to make Octi into a sort of enterprise machine, with its eyeballs and mouths on hinges with people popping out to say hi. It was a very creative idea and I really think he did a great job on it. I added a little cherry on top, translating Doppler into Radar and making it a man’s head. as well as a few touches like the rubber grommets. I also really dug all the rivets David added and how precise the seams were.

David also drew the safe and the screen by hand. The truck comes from a Yellow Icon icon pack.

image

Of course Sam had asked for two drawings, so I took a stab at the back. The idea was an enterprise that had collapsed under its own weight. The standard array of office apps aren’t getting the job done and pure chaos reins supreme. I went with the idea that the tentacles were literally crushing people, perhaps having been chopped off in places. People are trying to work with files but have no idea what to do or can’t work with them. Others have given up. Oh and Sam wanted a man with a bag over his head representing the employee, lost in a sea of files and confusion.

Here are the steps I took in creating it. If you’d like to see these in full res you can check out my Skitch account. I worked in chunks, sending progressive updates to Sam to be sure I was on the right path. That way if something was wrong he could stop me early and set me back on the right direction. Sam and I work best like this, especially for complex designs or illustrations and allows for a lot of feedback throughout the entire process.

As you can see, the first stab at the piles of paper looked a bit like rice. I ended up biting the bullet and drawing 10-15 unique pieces of paper and then cloning them all over the pile. I then unified them by giving them a universal light sorce.

image

You can also see where our styles diverge a bit. I used a more traditional illustration method, painting the scene with a Wacom pen and tablet. David used vectors and a much more controlled and precise style. His people are a bit stiffer, like what you’d see on a bathroom door. Mine are pudgier, luke plastic bags filled with blue jello. Neither way is right or wrong and I really liked seeing our different interpretations of the same subject.

David had given us a great start but Sam was a bit concerned that the Enterprise Octopus was looking too machine like. He wanted something a bit more organic. I went back and retouched it, removing many of the machine bits. To give the COLORS acronym a bit more contrast I added a wavy blue banner. This helped the words stand out a bit more.

image

To see them at full size and to get a bit more context check out Sam’s blog post explaining this madness. It goes into a lot of depth explaining what each represents and is a fascinating analysis of how enterprises work.

image

The new Jive Software site is finally up and kicking. It was a fantastic effort from our entire team to get to birth this whale and I couldn’t be a prouder father. We completely pitched out our old site and started completely fresh. Chris Kalani and I started on the new designs about 4 or 5 months ago, with a lot of careful analysis and planning. We garnered feedback from the whole company as to what they liked and disliked about the old site and how we could improve. Then we set out to make the best site we could.

We had some very specific design goals and ideas in mind. These were all goals that we could not and would not compromise on. We could argue about colors, layout and content till our faces were blue, but if it didn’t meet these goals, it was out.

  • Be super easy to update, both content and presentation.
  • Use the minimum amount of HTML and CSS needed.
  • Keep the layout flexible using a solid grid system.
  • Make screenshots understandable at a glance.
  • Use minimum colors for the pages so that imagery, icons and screenshots really stand out.
  • Don’t make the user hunt.
  • Must be SEO-friendly.
  • Build it for an enterprise user. Treat them like a human being.
  • Our site must reflect our products commitment to cross-browser functionality

To start out we browsed the web to see who was doing it right. I believe strongly in the philosophy that, “Good designers borrow. Great designers steal.” You can see most of our influence in my Flickr set, Web Design Inspiration.

image

We actually printed all of them out and posted them up on our wall so that we could always see them and reference them quickly. Then we began the process of generating wireframes and mockups. I don’t believe there is ever a completely linear path for designing a website. We’d jump back and forth between sketching ideas on paper, scribbling something up on a marker board or editing something in photoshop. We were never really done with sketching or mocking something up. If something needed changing we would either discuss it and alter it or tear it apart and start from scratch. Fortunately we had the time to do so.

I long ago lost count of the number of mockups we did. Some of that could probably be attributed to the fact that Jive as a company was swiftly growing during this time period. It’s worth mentioning that we were also working on a new logo, a new community, a new version of Clearspace, aquiring Jotlet, creating a new booth and completely rethinking some of our strategies. We were challenged with the fact that at times we still didn’t know how we were positioning our product or building our messaging. We definitely ran into some chicken or the egg problems with the design and content. We designers wanted to know exactly what sort of content we should expect in order to best build a design around that specific message. Meanwhile everyone else wanted to know what things would look like and how they would lay out so they had an idea of what to write. That’s something I hope to fix with my process in the future.

Overall it worked out well. While we probably spun our wheels a few times, we definitely came up with some really solid designs. While I love what we finally decided on, I think there are a lot of really great designs in our mockup pool. You can check them out for yourself on Flickr.

In the end I think we came up with an incredibly stellar site. We have a modular, flexible site than is easy to navigate yet looks killer. We incorporated Clearspace seamlessly into our site, driving our blogs and news and running our communities. All in all I feel that our site accurately reflect who we are as a company and what we’re trying to accomplish.

I should of course shout out a huge thanks to all who worked on the site. Designers: Chris Kalani, David Carroll and Josh Pyles. Backend Codeninjas: Benjamin Sherman, Chris Bohnert and Tim Neuwerth. Project manager and wall of defense: David Greenberg. Our SEO and Lead Gen master, Paul Biggs. And last but not least, our steadfast leader who let us do our own thing and do it well, Sam Lawrence. We survived a new logo, a new product, explosive growth and being relegated to the Manstable to put out an incredible site.

Oh and lest I forget, a huge thanks to all our wives and lady friends for putting up with us throughout this process.

The conversations Sam and I have are usually via IM. He’s usually off traipsing about the globe while the rest of us salt miners hack away at a design or code. Sometimes this can be incredibly frustrating as we are both very poor at instant messaging. Our brains move faster than IM allows. Three or four conversation threads start to happen at once. I’m also quite handicapped at conversing when I can’t gesticulate wildly with my hands. Occasionally though a true gem sprouts forth. Something like today’s amusing banter.

Michael Sigler: how’s the foot? is it rotting yet?
Sam Lawrence: it really sucks. it’s broken in three places and i’m in a stupid wheelchair
Michael Sigler: Do you have osteoporosis?
Sam Lawrence: blow me

Ahh Sam, what would we do without you? Hope your ankle heals soon!


The New Jive Stickers from Jive Software on Vimeo.

Ryan and Kalani were afraid that the new Jive logo stickers might be too confusing for some (like our IT department). They decided to use our CEO’s car as an example.

Sam posted about the new Jive logo a couple of weeks ago. I promised myself I’d post something more in depth but let myself forget about it. Then I saw this post over at 37signals and it reminded me how much I love how-they-did-its.

Sam’s already done a great job of explaining why we went with a new logo:

The “Bullhorn” didn’t represent collaboration as much as it did an individual voice. And it certainly didn’t match the new product logos and corporate identity. We hired a designer to help us back then but it didn’t result in anything we loved. It was just a painful experience and we decided to table it and concentrate on Clearspace. That behind us now, we embarced on re-addressing Jive’s logo a few months ago.

I’d like to add that the timing was great. We were already consdiering a new website, new marketing materials and even possibly a new booth. If we were going to change the logo it was sort of now or never.

We immediately went to Raja. He was a complete rockstar on several of our current product and website logos, including Clearspace and Ignite Realtime. Raja brought along Mike Erickson to help us out. At the beginning the one thing that was clear was that we really wanted to focus on a text-only treatment. We wanted to let the products retain the more icon-like marks and to make Jive more of an all encompassing emblem. We also suggested that it might be good to remove Software from the logo. Everyone refers to us as Jive. We call ourselves Jive. Why bang it over everyone’s heads that we create software?

Raja and Mike immediately began taking stabs at it. Our first direction was more of a take on “infinite unity” with a few simpler take on a stylized Jive inside a container.

image

This one we really liked at first but but never could get past the sporty, Nike-ness of it.

image

There were a few that were interesting but perhaps a bit too bizarre and others that just didn’t make the cut:

image

We saw a ton of options:

image

Eventually we saw something with some potential. It was a bit too whimsical at first, but Raja and Mike had stumbled upon something we really liked. We loved the flow of the inner line, how it created the dots for the J and I. We also liked the dimension created because the line didn’t cut completely through the V. Almost like whatever was cutting the logo apart was going behind it.

image

We went through several variations, until after a late night I stumbled into this idea. It had the feel that we wanted. Large, bold, concrete, energetic, and with the right balance of enterprise-class business and hip technology company.

image

Of course just because I was close didn’t mean we were there yet. Raja and Mike spent plenty of time correcting the kerning and letter weight. We explored a multitude of different typefaces until we had altered things so much it was pretty much our own. We bounced ideas around internally, sometimes quite heatedly. John (dude, get a blog already!) pointed out that the swoop was a bit too much of a “comet” crashing down to the ground. To emphasize growth he flipped that frown upside down, which made a subtle but quite impactful difference.

Color was a particularly hard decision for me. I really loved the green and blue. In the end I finally relented when I realized my feelings were more ego-driven than logical. Finally we decided on what we have today. A logo that looks great on pretty much any color background you throw at it. Its an equal balance of sophistication and energy with a tone that speaks to both business and technology.

image

I’m incredibly proud of all the work we did. Huge thanks to everyone who helped. So far it has been a huge success. I’ve been surprised at how quickly it has been adopted and its finally starting to feel like us again.

If you’re still reading then you might be interested in a little pixel-love I eeked out for the unveiling of the new logo. It’s a Jive wallpaper at 1600x1200. Enjoy!

image

Page 1 of 2 pages

 1 2 >

The Worthy Few

  • The Skirt. The only broad crazy enough to marry me.
  • Dragon Avenue. Where gamers kill things and take their stuff. And then they post about it on our wonderous D&D site, now with 600% fewer animated torches.
  • Jimbalaya. Best bronsky ever.
  • Vandersexy. Slightly less of a curmudgeon that he would like to be.
  • CK! Kirk Reeve's biggest fan.
  • Israel. To my Canaan. He will learn to rue the day he fired that first volley of air can.
  • Always Big. I actually have a boss who knows what a blog is.
  • Geeky Girl Dawn. Werewolf master, village slayer.
  • Jusdrum. Manipulator in chief.
  • Techpaulogy. Be careful. Follows Siglers when drinking.
  • Work. The wonderful world of Jive Software.