The reason why zopim came into existence was because of the many many problems that traditional live chat solutions or chat widgets had, especially for business owners who are trying to sell effectively via their websites.

One of the problems we wanted to solve was the clunky chat interface for your visitors. If you value your customers’ surfing and chatting experience, do read on..

How others do it

The traditional chat solution involves a chat button inserted into the website. When clicked, another browser window pops up. In many cases, users might have to fill up a long survey form asking for their name, purpose of contacting, etc.. etc.. before actually getting to talk to someone at all. If your company is a mega corporation with many angry customers wanting to complain about bad service, this is totally fine.. your first line of defense (the clunky chat interface) has helped you scare off most of your customers.

Popup Chat Window

How we do it

However, if you’re a business owner who value every surfer on your website as a potential customer, what you want is a chat service that integrates right into your website - or in technical jargon, an inline chat window - just like the one here (with all its AJAXY goodness and sleek look). Our premise is simple, many of our existing customers just want a chance to pitch to visitors on their site. If the interface stands out, and the interface is simple, chances of that happening is much higher, as our testimonials show.

Inline Chat Window

The fact is popup browser windows has usability issues and is considered by many to be a clumsy interface that will gradually be phased out. Google led this move by replacing popup-ads with inline text ads a long time ago. The keyword here is inline.

Inline chat window, contextual chat window, draggable lightbox-like chat window, cool funky meebo-like floating window, whatever you want to call it. We just want to create the ultimate chat interface for visitors on your webpage.

Here are a couple more reasons why popup chat windows pale in comparison to our inline chat windows:

• Context matters, seamlessness does too. A chat session should happen on the webpage which maintains the context of a chat conversation. Not in another lonely browser window. The reason you’d embed chat on a page is to help that visitor as he’s navigating your page. You don’t want him alt-tabbing between the conversation in the chat window while trying to read the content on your webpage. That sucks.

• Popup blockers. Over enthusiastic ones might block all popups. You’ve done it right? Clicked on a link, page, image and then…(nothing). What happened? Oh it’s the pop-up blocker that ate it. So while you figured that out, the average user who is not savvy to browser features and functionality (such as pop-up blocking) will probably blink and miss the hidden “aha”.. and move on, missing out the chat session altogether.. UNLESS you do the below.. (This screenshot from an actual website explains it all.. LOL)

LOL

• Its just cool. Hack, look at meebo, they blew everyone’s socks off when they first launched.. like WOW, i didn’t know i could IM like this on a browser. There were other web-based chats out there, but they just weren’t half as cool. Now we want to bring that one step further and recreate the same experience on any website that embeds our solution. When your visitors chat within zopim’s window, we want them to be blown away by the ease of use and come back to your website for more.

You might ask, why’s no one else doing it like us. That’s another story by itself, lets just say its not easy making sure this interface works seamlessly across different webpages with different layouts running different javascripts embedding different kinds of media (flash etc..) on different browsers (like a certain IE6?!), with users opening multiple tabs. There were bleak times when we wanted to give in and just resort to using a popup browser window. ;p

It seemed like just yesterday when we rolled out Zopim ver0.2 on 8 Apr 2008, which was quite an overhaul of our initial prototype. Five short months later, here we are again, announcing the release of our spanking shiny new dashboard, along with some improvements to the visitor’s chat experience. This wasn’t your typical makeover. It was extreme.. Here’s the before and after of the old desktop and our new dashboard. Note the upgrade in the name as well.. desktop is a maliciously confusing word. Imagine us troubleshooting a problem,

developer1: “Is the desktop still running?”

developer2: “What, are you dumb, of course my desktop (computer) is running..”

or

sales guy: “Hang on, let me check..”
*closes all desktop applications to go to windows desktop view*
“Ya, hmm.. wait, I seem to be missing some icons here..”

Old Desktop

New Dashboard

So, whats different? The most obvious difference is of course the cosmetic upgrade. We tried to retain certain elements of the interface design so that existing users won’t have difficulty transitioning from the old desktop. At the same time, wherever possible, we have tried to make the dashboard even more intuitive and easier to use than before. More details on that below..

Technological Upgrade (For the geeks who simply must know)

1. Migrated from using DHTML/Javascript (or AJAX if you like..) to Flex
2. Multi-mode of communication, TCP Socket / HTTP Long Polling (or Comet if you like..)

What this means (Translation for the non-geeks)

1. Better cross-browser compatibility. The new dashboard is a swf (flash) file which kinda runs the same on all browsers.
2. Ability to churn out nicer looking graphs to display statistics and analytics - chat analytics as well as agent-performance analytics - which will be rolled out as a paid feature later this year. Basic web analytics will still be free.
3. Better handling of animation and effects, enabling better interaction between user and application.
4. With the multi-mode of communication, if your visitors are surfing behind a corporate firewall (yes, thats what most of them are doing, secretly surfing during work ;p), they would still be able to chat with you. Based on initial observations, you should be able to see around 5-10% more visitors.

Feature upgrades

• Tour / Help which helps to quickly bring first-time users up-2-speed with the dashboard interface
• Web statistics overview. See at one glance how many visitors, page views, conversations, etc.. you’ve had over the past days, weeks or months. Find out if Zopim has actually helped you increase web traffic, and number of conversations compared with your previous solution. Let us know if we did =)
• Administration panel. Administrators can now add and manage agents. Go crazy and add as many agents as you like, while we still haven’t imposed any restrictions on the number of agents you can have. ;p

Interface upgrades

• Adding shortcuts shouldn’t be a hassle. Thats why we included a click-to-add interface. Just chat normally and whenever you feel like you’ve just said something smart, simply hover over that message and click to add it into your database of shortcuts.
• Searching through your chat logs is a breeze now. No more complex fields to fill up. Just a plain search box and you should be able to find what you want. There’s still advanced search in case you really need to fine-tune your search parameters
• Want to find out more about the visitor you’re currently chatting with? You can now easily cross-reference his previous chat logs and other details in the same view

Known issues

• Scrollbars appearing randomly - Seems to be a flex issue and appears pretty randomly. Usually resizing your dashboard would fix the problem. We’ll find a way to fix this.
• Double-clicking and ctrl-? commands (eg. Ctrl-A to select all) sometimes don’t work - Seems to be a flex issue as well. Before we find a fix for this, it would help to hold down the keys longer.
• File takes a long time to load. Because of the features we’ve packed into this upgrade, the file size of our flash application stands at just below 1MB. But no worries, it should be a one-time thing, once your dashboard loaded the first time, it should be cached subsequently. Our next step would be optimize our code and make the file much lighter-weight than before.

What to expect (In the near future)

• People Browser - Trace the visitors you’ve had since deploying our product. Cross reference their webpath and chat logs to better understand their mentality while surfing your site. If they’ve left their details such as name, email address etc.. you would be able to export these information and handle click-to-chat email campaigns in the future.
• Chat Trigger Interface - want the system to automatically send out chat requests on your behalf after a visitor performs a certain action (like going to a particular url, staying on the site for more than 3 mins)? The chat trigger interface will enable you to customize this behavior. In the meantime, we can provide advice as well as help implement such triggers for you on a consultation basis.

Thats it, do send us your feedback at support@zopim.com. Enjoy!

I was reading an interface design blog (Peachpit’s “Stupid User Syndrome”) describing how web users inadvertently make mistakes or often change their minds and need a way to undo the minor / major changes (damages) done.

Coupled with the recent hilarious email boo-boos I’ve witnessed recently, I concluded that one of the worst irreversible mistakes you can commit online is sending your email to the wrong recipient. The consequence of this act can range from trivial to mama catastrophic. Here are some true stories. (Feel free to add your own sad stories)

1. Gary (name changed to preserve anonymity) received an email from a colleague that reeked of incapability. He excitedly forwarded the email to all the other colleagues celebrating his/her incompetence amongst some superfluous words to spice up the story a little. Everyone had a great laugh.. only when Gary found out he had clicked on reply (and replied ONLY to that colleague) instead of forwarding it. (Gary was a good sport to forward the entire conversation to the rest of us after he realized his mistake. I would have buried myself in a hole)
2. Dubner from Freakonomics calling a researcher “a liar” and accidentally including that researcher in his mail.
3. Hey, even millionaire CEOs are prone to making embarrassing mistakes like that. A recent email blunder by Angelo Mozilo, head honcho of Countrywide Mortgage, proves that. As reported by the L.os Angeles Times, Mozilo did what Gary did above: The harried CEO had intended to forward a customer’s email to some of his subordinates but instead he clicked reply and sent his message back to the customer. In his message, he described the customer’s email as “unbelievable” and “disgusting!”. (lifted from here) Needless to say, he suffered a backlash of epic proportion compared to Gary.

While its fun to hear about these stories and laugh your hearts out, deep down, you know one thing. It WILL happen to you some day. And if this happens to everyone, surely there’s something that email interface designers can do to mitigate this, right? Or maybe its easier to blame it on the sender for not being cautious enough.

Its true that before clicking on the sacred send button, the sender is responsible for checking every field thoroughly. I’m a religious practitioner of this. I don’t even ‘click’ on send, I HOLD it down (just to let my mind register the holiness of this act) and scan through the entire email to make sure everything’s alright before saying my last prayers and releasing the button. And suddenly, I’ll spot it, that one email address that I should have removed after I clicked on “reply all”, or that customer’s name I should have changed when I’m using my Dear XXX template, or that <101 ways of screwing your email>.. and as I’m frantically wishing time would move backwards for that 1 second, all I see is..

Email Sent

I’ve spoken to friends like myself who just wished in that split second after clicking send, there’s some way to undo the send process. Here’s my plea to email interface designers. Let me click send. Show me the progress bar, fool me into thinking you’re sending the mail out. But have a ‘cancel’ button beside the progress bar so that in the 1/100 times that I need it, its there to bail me out. If I don’t click it after 3 seconds, remove the cancel button and do whatever you need to do. Sure, I’ll lose 3 seconds every time I send an email, but hey, email isn’t real-time anyway. (no matter what you crackberry users think)

This post is dedicated to all you email blunderers out there. Next time you (or I) commit another email boo-boo, don’t apologize. Stop taking the blame for not being responsible and checking your mails before sending em out! Blame the email interface designers! Thats responsibility =)

Zopim is having a mini showcase this Saturday, 12 July, at Biopolis.

We are part of a line up of startups showcasing at E27 UnConference, a sharing session hosted by E27 where the topics are usually arranged by the attendees themselves. Unlike conventional “conferences”, its an open social platform where people come together to discuss about upcoming trends and share ideas about the future of the web.

We will also be facilitating the one of the breakout sessions, together with James Ong from Origami Frontiers & Techsailor, on emerging trends of Web 2.0 on the enterprise front. The theme is proposed by the community, who are interested to understand Enterprise 2.0, the next possible frontier of enterprise services in the form of community and social computing after ERP and CRM.

Do join us in all the five breakout sessions, startup pitching, keynote presentation & networking, tickets available here.

the following observations applies only to wordpress, the self-hosted blog software..

You’re looking at our blog revamp! It took only a day to migrate from blogger to wordpress, including customizing the template to look the way it is now, and I thought I’d take some time to rave about it.

Having migrated from wordpress to blogger (due to some misplaced advice) and now back to wordpress within a span of 2 months, I now have the dubious distinction of being ‘the most experienced blog migrant’. And coming from someone who’s done it both ways, I can’t think of a reason why anyone would choose blogger over wordpress, unless he really hates himself, or he can’t afford to host his own blog. Either way, its sad. I know I’m being biased here.. this blog actually does a good job of comparing the good and the bad of migrating.

Since I’m still in awe of how great the latest wordpress is compared blogger, I’ll quickly pen these thoughts down..

Besides having a beautiful and clean interface (cleaner than the champion of clean interfaces - google), it’s extremely user-friendly as well. Small things like having automatic pingbacks, Akismet spam protection and media library management really added up in terms of user experience. What really made the difference though, was the importing of old blog posts and ease of theme customization.

Importing of old blog posts

During the migration back to wordpress, importing old posts was my most dreaded process because I remembered how painful it was to move my wordpress posts into blogger. Search for “migrating from wordpress to blogger“, and 50% of your top hits will probably be for migrating the other way round. And the top relevant hit involved doing a mysqldump to grab the blog posts and writing a python script to get the comments. NICE, for a geek. Not for me.

Going from blogger to wordpress was magic. Literally. Here’re the steps, and I won’t even dare call it a guide, its dead-simple. If you want the ‘ultimate guide’, you can get it here.

Step 1: Click on Authorize. You’ll be brought to a google log in page to key in your blogger id and password. Next, just grant wordpress permission to access your account.

Step 1

Step 2: All your blogger posts and comments will magically be available for importing. You just need to click on “The Magic Button”.

Step 2

Step 3: You’re done! You can now “Set Authors” which is simply mapping your blogger authors to your wordpress authors. Sweet!

Step 3

And since its so fun, wordpress actually allows you to clear account information so that you can redo everything again and take screenshots, like i just did. Its also just in case some of your writers continue contributing posts in blogger, you can still import them and wordpress will handle all the duplicates. magically. Sweet huh!

Theme Customization

Unless you’re willing to read through all the pages (like this) describing how Blogger’s own templating language works, don’t even begin. Though I must admit I didn’t really give it much of a chance, I did try to edit the blogger template html to customize parts of our old blog. There were too many rules to follow (eg. i couldn’t have html tags within ’section’ tags) making the templating language more prohibitive than er.. Singapore. You’ll probably see 1537 of these messages and finally decide its not worth your time.

“We were unable to save your template
Please correct the error below, and submit your template again.
Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: The content of elements must consist of well-formed character data or markup.”

Wordpress in comparision uses php templates which most web developers are well-versed in anyways. Their APIs are relatively simple and well-documented. Getting information about your blog is as easy as using get_bloginfo(). If you work from the default wordpress template, you won’t even have to read up much about the APIs. Just read, understand and copy =)

This is an update on the status of our webpage makeover. It is still under way, but we’ve managed to get a couple more pages up, such as features, contact us, and learn more, to provide more information about our product. It is still pretty barebones for now, but at least there are no more dead links and placeholder texts lying around.

This month’s an exciting month for Zopim, we’ll be all over the place, literally. Our designer will still be in town attending her graduation ceremony. Some of us will be in the Bay Area (California) to work our hats off, while one of us will be touring Europe for 3 weeks. Talk about equality… =)

While in Silicon Valley, we’ll be attending TIECON (dubbed the world’s largest entrepreneurs conference) to showcase our product as well as get some insights and pointers from many of the distinguished speakers at the event, including executive team members from companies such as Intuit, Rockyou, Facebook, etc..

Just like the announcement on our webpage, we may be overseas till the end of the month, but our heart and souls are still with our users. We will still be checking our emails and live chat regularly, albeit in a different timezone. So just drop us a message if you need us.

If you happened to surf here via our webpage, you’d have noticed our *spanking* new design! We actually got the finalized design sometime last week, thankfully our in-house designer, tengwan picked up html and css quickly enough to whip up the webpage!

The design was created with simplicity and fun in mind, hence the bright colors and non-cluttered feel. Some website designs that we referenced were 37signals, crazyegg, splunk and of course our favourite fogbugz, with whom we promised we’d get our new design up by May 1st.

If you’ve tried navigating around, you’d find that most of the links aren’t working. Ideally we’d like to launch our website with everything in place, but a promise is a promise, and must be carried out at once!

Promises are like crying babies in a theater, they should be carried out at once.
~Norman Vincent Peale

Thats why the old design has been taken down even though we aren’t quite ready to launch the new webpage yet. Bear with us for just the short moment though, we’ll throw in the rest of the works along the way.

Meanwhile, couple of things works on the main page, like the animations for the 4 main descriptors on the page (which still feels quite jarring, we’d definitely work on it). You should also notice our chat button prominently docked to the top right of our page. Already there was a customer who asked why we keep the best button designs to ourselves!

Its actually the same button as all our customer’s but strategically hidden by our new button. You’d be able to see it with your firebug on. Eventually our button will have the ability to be customized, but for now, this quick hack works fine for us =) Something else that works quite fine is our sign up form itself ;p try it to believe it!

We wouldn’t have been able to deliver our promise without our dear designer, Winnie, who tirelessly worked through several iterations of this design and listened patiently to our requests and feedbacks. Thanks Winnie, we love our new look! And we hope you guys love it too!

We’d like to thank our users for their feedback and bug reports. To make it even easier for you to send feedbacks, there is now a feedback button within the desktop itself. And your submission goes straight into our issue tracking system!

We’ll be rolling out more of these weekly minor releases, so keep your suggestions and feedback coming in. We still entertain emails, IMs, snail mail, or phone calls. Oh ya, livechats too ;p

Improvements

• Agent Desktop
• Feedback option - file a bug report / feature request right into our issue tracking system
• Added ability to ‘preview’ webpages that your visitors are on
• Added ability to refresh webpages inside ‘preview’ windows
• Visitor-side (chat button and chat window)
• Made name changing more intuitive to visitors by adding ‘click to change’ beside their name
• Chat windows are only opened when agent sends a message to client. Previously when agent double clicks on a guest, the chat window is opened on the visitor’s side
• Added sound notification for incoming messages on both agent and visitor side

Bug Fixes

• Disconnection alerts fixed. Now upon disconnection, agents will be able to know if his account had been accessed from another location or if it broke off due to internet connectivity problems.
• (IE7) Phantom dialog box remained on the screen after agent ends a chat session. Problem fixed.
• (IE7) Fixed weird bug where ‘Chat Logs’ module wasn’t loaded when js file was served from cache.