Prateek Dayal

Last few months have been very interesting as we had been working hard on a new Muziboo that we finally launched yesterday. It was very exciting because this is the first Muziboo design where we have worked with a professional designer and there has been a lot of learning involved. This will be a series of posts where I will write about the Why, How and What of the redesign. I am hoping to turn this into a discussion and see what others think about the whole process and where we could have done better.

Starting Point

Muziboo has a lot of professional musicians and the website serves as a portfolio for a lot them. Some people have actually managed to talk to prospective clients through the website. Lately there had been many requests for 128 kbps streaming and a couple of other features like reuploading, private sharing etc which make a lot of sense for professional musicians. We therefore rolled out the pro account beta and were working towards releasing it to everyone. Before the release however we thought of polishing up the UI a bit and started looking at things we can improve from usability perspective. The research led into a lot of insights and we decided to redo the whole UI.

Analyzing the Logs

We started with google analytics to find out what we can improve. Google analytics has some pretty neat tools available to help you identify weak pages in your website. These are pages with high exit rates and bounce rates. There are some bounces that you cannot help but there are other that can be helped. To know this, we looked at the bounce/exit rates for different keywords and entry sources. On some of the pages, there were bounces for keywords that we actually serve. We also found that the referral traffic converted pretty well and came to a conclusion that people who come after reading about muziboo or by clicking on our widgets convert well. Putting these two observations together, we came to a conclusion that some of the pages were not conveying the correct picture and orienting the user well. Another interesting observation was that every page that had little or no related content had high exit rate.

Talking to the users

Next we talked to a lot of our user to know what they liked about Muziboo and what more they would wanna see. We asked them about their first impressions of the place and what made them stick on. Most of these discussions reinforced the feeling that most people value the community here the most. Another learning was that most musicians value charts a lot and that was something missing in Muziboo.

Armed with all this learning we set out to do a complete overhaul of Muziboo. We decided to work extensively on improving the usability and also the look and feel of the site. Another thing that we decided to focus on was the interaction design to make sure that as the site grows the personal feeling does not go down.

In the next post, I would be writing about the specific changes that we did to improve the usability and interaction and how eating our own dog food helped us a lot :)

Popularity: 12% [?]

I have been working on Muziboo for the last 11 months now. We have done one major design revision and countless small iterations to improve the design (and ofcourse the usability). Things have show a lot of improvement and often even surprised us a lot. Being an engineer by graduation and at heart, its pretty tough for me to do the UI stuff so I thought of writing down my learnings here for other people who are in the same boat. You should (and most likely would) know that i am not a UI or usability expert, so if you wantsome real advice, go hire one. I think they are worth the money.

If you want to learn about usability, Jacob Nielsen’s website and Don’t make me think make an excellent read.

So here is how not do design your UI :)

1. Lets make it look beautiful

This is certainly the worst way to design. Its good to make your pages look nice but that alone should not drive your decision about placing things in your layout. A good way to design is to decide on the purpose of the page and see what makes the most sense. What can make it clear what the page does and help your users in doing it.

2. Lets put more content in this page. Too little right now

This is another mistake that I have personally made too often. For example, putting another tag cloud so that users don’t quit the site on this page and have something to hop on to. Putting stuff thats not related to the theme of the page, dilutes the purpose of the page. Certainly no page should be a dead end but other links on a page should feel like a logical hop rather than some random links thrown in. So while music recommendations for related music is a good idea, a tag cloud probably is not.

3. Giving equal importance to all page elements

If you land on a page and nothing stands out, you will be confused. You would spend some time in figuring out what the pages does. The purpose of your page should be clear. You can use big fonts, graphics etc to make sure you can get the message across before everything grabs user’s attention. A great example of that is Flickr. “Share your photos Watch the world” has big impactful font. Enough to catch your attention before anything else grabs it.

4. Not having a consistent structure across the site

If your pages don’t follow a theme, your users would have to figure out stuff on every page. For example. when you go to orkut or facebook, you generally know where to find the comment box or where to find the apps, where to find fans (in groups/pages) etc. You even know where to find the “Share” link on every page. Once you have learnt a page, you don’t need to spend as much time learning other pages. Define your site’s structure and then follow it.

5. Designing based on user inputs alone

Its great to listen to your users and it really helps, but most likely you will be able to talk to only a few people and that would never give you a clear picture of whats working or not working. I recommend using google analytics or similar software to find out your weak pages. These are pages with highest exit rates or bounce rates. You can also find the entrance sources on the page (keywords that people use to find this page on a search engine). If your entrance keywords are related to the page and the bounce/exit rates are still high, may be people are not getting your message right and its time to redesign the page.

These were some of my personal learnings that I am applying to come out with a new design for Muziboo and I will post the results of my experiments in another blogpost. In the meantime, let me know your feedback.

Popularity: 7% [?]