guy.pyrzak

Prepare yourself for some changes people!

2010-07-09T08:49:00.000-07:00

Bugzilla 4.0 has frozen and soon it will be released. There are a bunch of exciting changes that you can expect which I will try to highlight over the next few posts. The big ones that I'm sure will get a lot of attention, for better or worse, are:

the autocompletes for user fields and keywords
redesigned advanced search page
the redesigned attachments page.
create page validation

We've also got a patch in the works that will redo the homepage and make it much prettier and professional looking thanks to Jon Pink. You can also look forward to that in 4.0!

I've attached images of the 3 new pages which will hopefully encourage you all to play around with landfill!

As always we'd love to hear your feedback about this and the other changes that are coming in 4.0 (there are a lot of them, jsonp, better extension support, new default workflow, more webservices... it's a long list).

Bugzilla Extensions: Gravatar and Inline Images

2010-03-08T21:58:00.000-08:00

There are 2 bugs which I have been paying some attention to recently.

The first one is Bug 222861 which requests that images are displayed when they are mentioned in comments. This bug was important to me because I often found myself and others referring to images and attachments in comments and then having to open them up in a new window. I really wanted developers to just see the mocks i made along with my comments about them. It was determined that this bug makes more sense as an extension. So I wrote one. I've posted it here: http://github.com/pyrzak/Bugzilla-Extension--Inline-Images. Hopefully you guys like it!

The second one is Bug 395802 which requests to be able to support gravatar images. This is something Aza Raskin specifically mentioned by saying make it easier to know "who is this guy". Step 1 is adding a human face to a comment via the gravatar, Step 2 might be about grabbing their stats.

There were 2 mocks that I made as suggestions for how this should look. The first is:

Here is the other mock:

My hope is that we're finally to the point where many of Aza's and other's ideas might be possible thanks to the new extension system and the jsonp bug 550727. Both of which wouldn't be possible if mkanat didn't work so hard to add this kind of mash-up and extensibility, so thanks!

Any feedback about either of these extensions or anything else I mentioned is very welcomed.

New Advanced Search UI V2

2010-02-27T16:31:00.000-08:00

Here is the second version trying to take into account the suggestions given.

This UI would remember whatever is expanded and collapsed based on the user's cookies.

Another option that isn't displayed here is the column layout would change from 3 to X based on how wide the screen is (aka elastic).

I tried to increase the information density as well.

For saved/editable searches we might try to use the text description from the search UI.

Looking forward to hearing your feedback about the changes and improvements.

A new layout for the Attachments page

2010-02-27T10:50:00.000-08:00

There were some comments today about the attachments page and how wonky it is. Bug 101770 has become the place where I've decided to post a response and possible solution to the problem but since I'm sure folks don't want to bother going to the bug here are the images that I posted. Let me know what you think. My hope is that we'll be able to implement this new UI quickly and make a big improvement without making anyone too upset about losing the current Attachments UI.

Things to note. The comments box and the attachment iframe would be elastic so they would grow with the width of the page. Clicking edit attachment as comment would cause the comment box to go away and the big area would turn into a comment.

My hope for this layout is to 1 give more realestate to the comment box that is equal to the area on the current bug page as well as make it easier for people editing the patches directly to have more room.

This UI also puts the focus where it belongs, on the attachment itself.

Things to note. I'm not at all happy with the placement of the patch and obsolete checkboxes. Any suggestions on where those should go is greatly appreciated.

Make it like code.google.com's bug tracker

2010-02-18T14:03:00.000-08:00

For a while we've been having discussions about tags and Bugzilla on the dev mailing list. To boil down a lot of the suggestion it consists of "we could do away with most of our fields/flags and replace them with tags, it would make the UI way better".

We've also had other discussions about how the bug edit page should change. Many of the suggestions consist of moving the non-comment data about a bug to the left or right side of the page and letting the comments take up most of the page.

Today (for the first time) i went into the code.google.com (cgc) bug tracker to see what the status of tagging was in chrome. Turns out both of these UI suggestions are exactly how chrome is implemented. I event went to the advanced search page to see if the suggestions i received from the advanced search page were the same (they weren't).

Anyway, i've received the message loud and clear "we like how google did it".

I'm tempted to make a jetpack that makes the BMO UI act/look a lot more like cgc. What do you guys think? Is it worth it or is TidyBug more the direction people prefer?

If you haven't seen cgc here is the URL i looked at today: http://code.google.com/p/chromium/issues/detail?id=17536

Tidy Bugzilla for Jetpack... kinda

2010-02-17T09:39:00.000-08:00

So I saw the post for TidyBug and noticed someone commented that they switched back to Greasemonkey from Jetpack. I really like the idea of Jetpack, so i was bummed to see that someone had switch away from it because they wanted this feature so... I tried copying some of the features of tidyBug over to Jetpack.

Here is the URL for the jetpack in the gallery: http://jetpackgallery.mozillalabs.com/jetpacks/346

and an image to see what it does to the edit page...

For those of you who are not familiar with tidy bug here is the original post:
http://www.squarefree.com/2009/02/26/tidybug/

I'm still working on moving over all the features (like keyboard shortcuts). But the minimizing (what seems to be the best part) is part of this. Plus this version works with ANY version of Bugzilla running 3.4 onward, not just BMO.

For those using Chrome I might try to port this over as a chrome extension next weekend.

I'll also try using jetpack to prototype some other desired features, like prototyping the quicksearch helper mentioned in my previous post.

Feedback is always appreciated.

Update to the Advanced Search UI

2010-02-15T19:34:00.001-08:00

We've been working on fixes from our usability research and surveys. With the recent post of Bugzilla for Humanity, I was inspired to work on the Advanced Search UI because as Johnathan put it, "it is complete and terrible" and for "99% of searches you don't need it". However the other search, the simple search he doesn't bother to mention and of course he <3's quicksearch. I've filed bug 544404 to help quicksearch magic become more discoverable.

So the solution to make the advanced search page less complicated is a multi-parter as always in the Bugzilla world. Here are the steps which may or may not happen in the order they appear.

Step 1. Make the big summary box at the top of the page use quicksearch instead of a summary search.

Step 2. Make the other boxes on the advanced search page work as a helper to the quicksearch

Step 3. Make the advanced search page less complicated.

1 and 2 are more or less out of my area expertise so I'll leave those to mkanat and jjclark. But making the advanced search page less complicated, I can help with.

The approach I took was inspired by the redesign we did at work, basically apply a grid and hide the stuff that doesn't matter most of the time.

I've posted mocks up on bug 450301 but since I'm sure no one wants to read through the bug I'll post the images here:

and the expanded version

What do you all think?

Bugzilla JSON-RPC Webservice with JQuery

2009-07-08T20:40:00.000-07:00

I already posted how you can use YUI to use the Bugzilla web services available on the head. But lots of people don't like using YUI and prefer using JQuery. I haven't used JQuery much, but this experiment seems to have gotten the job done and should supply a basis for how to do more complex stuff with JQuery and the JSON-RPC interface.

Please note the JSON serialization capability isn't part of JQuery so I used a plug-in. The plugin doesn't seem to be as powerful as YUI's JSON serialization, but maybe it is and I haven't explored it enough. Anyway, here goes!

First you'll need JQuery and the JSON serialization parser. I added it under YUI but you should be able to add it before or after the YUI in the header.


    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://jquery-json.googlecode.com/files/jquery.json-1.3.min.js"></script>

Next comes the actual code which is very similar to the previous post.

First you create the JSON-RPC object:


var myObject = { "method": "Bug.add_comment", 
                 "params": [ { "id": 1, 
                               "comment":"I am using bugzilla's webservices with jQuery! YAY" 
                           } ], 
                 "id": 1 };

Then we encode it into a string:

var enc = $.toJSON(myObject);

Lastly we send it on its way using the JQuery ajax method:


$.ajax({"contentType":"application/json",
        "data": enc, 
        "dataType": "json", 
        "url": "jsonrpc.cgi",
        "type": "post",
        success: function(d, ts){
                    console.log('w00t',d); 
                    console.dir(d);
                 }
       });

Just like in YUI we need to make sure we set the contentType to application/json and use a post (get is still disabled due to cross site scripting concerns). I set the dataType to JSON so Jquery would deserialize the response for me.

And now we've got a basic JSON-RPC message being sent. Now we'll still need to handle errors etc, but for now this is enough to get any eager JavaScript developer going.

Another example is getting bug info which might be equally helpful is available below. This method gets information about 2 bugs. I'm not going to explain it as much but it follows the same pattern.


var myObject = {
               "method": "Bug.get",
               "params": [{ "ids": [1,2]}],
               "id": 1
               }; 
var enc = $.toJSON(myObject); 
jQuery.ajax({"contentType":"application/json",
             "data":enc, 
             "dataType":"json", 
             "url":"jsonrpc.cgi", 
             "type":"post", 
             success:function(d, ts){
                     console.log('w00t', d); 
                     console.dir(d)
                     }
           });

The hope is eventually to release some JavaScript plugins for YUI (2 and 3) and JQuery that will make this sort of stuff much easier, like handle the serialization, and errors. But for now these examples will have to do.

For more info about what Bugzilla web services are available check out:
http://www.bugzilla.org/docs/3.4/en/html/api/index.html

Next experiment... Jetpack! Any ideas on a cool bugzilla jetpack app?

Lots of Design Feedback and Bugzilla Usability Data

2009-04-23T21:28:00.000-07:00

There has been a lot of interest in the Bugzilla UI recently, which I'm super excited about. Attending usability conferences like CHI, I'd often hear about how hard it is to get any interest in usability or design in the open source community for various reasons (1, 2, 3, 4).

However, thanks to the post that LpSolit posted, many designers at Mozilla have stepped up with improvements to the Bugzilla UI, there is Boriss's suggestions for a new UI as well as Fligtar's new skin. Even a graphic designer from Spread Mozilla, graphicguru, stepped up to help improve my pathetic attempt at graphics(1,2,3). We've gotten some developers, like SS, to give some very useful feedback about how he'd prefer a more minimalist skin in general. And to top it off there has been feedback about new ways to think about the workflow from Jesse. Not to mention the meeting we had with the some of the Mozilla designers about future directions for Bugzilla, as documented by Aza. And today we had a small meeting with even more Mozilla folks about how they thought the tool could be improved. We're hoping to have more meetings in the future with Mozilla developers and get even more thanks to Jono.

It's been extremely exciting it is to see so many people interested in the Bugzilla UI. I'm hoping that with all these ideas you all can expect to see many design and usability improvements in future versions of Bugzilla.

But as my professor Bonnie John would say, one shouldn't design or develop without data. Turns out Mkanat, and many of the Mozilla folks feel the same way! And thanks to a very dedicated and smart group of HCII Carnegie Mellon students we've got usability data. This data was collected this past fall on Bugzilla 3.0, and I've attempted to post their research more or less unedited from their project to the Bugzilla wiki.

I haven't had a chance to look through and write an executive summery/conclusion to all their great data, but I thought to post it without one and perhaps let you all peruse the data and supply me with your important take aways from the data. This research was not based on how people use Mozilla's Bugzilla, but how people use bug trackers in general at software companies and other domains.

Let me know what you think of the data, what takeaways you find and what conclusions you draw from the data and maybe I can crowd source this task conclusion writing task.

Unfortunately Bugzilla 3.4 is going to be out the door pretty soon, and we won't be able to get many of these improvements into this version, but maybe we will see some of the improvements suggested this past week as well as ideas from the usability research appear in 3.6 or later versions of Bugzilla.

Again thanks to everyone who has become interested in redesigning Bugzilla, keep the designs and ideas coming! Feel free to email me when you've got ideas or designs and maybe we can work together to get the ideas into the source.

A new Login Form for Bugzilla

2009-04-16T20:38:00.000-07:00

So we've gotten lots of great feedback on the homepage, it's been really helpful and we're talking to folks about redoing the icons, making sure that the big icons are the right choice and much more. Wait for a post to find out more about the future of the homepage!

But we're also working on the log in process, attempting to make that easier as well!

Here is a view of the current log in form as it exists on the head.

One of the problems with this UI is that you can't reset your password very easily from this page, or any other page really. The nice part is, you can log in from any page, and not have to go through some intermediate page.

So here is the solution we've though of to make it easier to reset your password or log in from any page in Bugzilla.

How it appears if you've never come to the page

What happens when you click on log in, cursor focused on the log in. This is also what happens if the browser auto fills in your username and password.

This is what you'll see if you click on the forgot password link.

I omitted a close icon for now because it didn't seem necessary, but maybe you guys think it is. Let me know!

We're also adding a link to the reset password on the bad username/password error page.

One more thing to note about how this form will work. If the browser auto-fills your username and password, we'll make sure the javascript on the page detects your username and password and displays them to you, so you don't have to click the login hyperlink to login. We're hoping this will maintain the 1 click to login capability that so many people like.

This isn't something that will magically make Bugzilla super easier to use, but hopefully this will take us one step closer to a more usable Bugzilla.

As always feedback is really appreciated and unlike my previous post, I'll get emailed when you guys comments, so hopefully i can respond to your feedback in a more timely manner. Can't wait to hear your opinions.

Bugzilla's new UI for Index.cgi

2009-01-29T18:22:00.000-08:00

Bug 475063 is an enhancement to "Make the logged-out index.cgi simpler". After a few chats with Max Kanat, I've mocked up and submitted a patch to do just that.

Right now the patch looks like this.

Since this is a major change to the Bugzilla UI I'd love to get some feedback about this!

A few things to note:

There have been some discussions about how Buggy should look, with a pupil or without, more recongnizable or less, or even if we should use him at all. So that's in a state of flux.

Also for the dusk skin this UI will look the same, just set to the monocrome of Dusk.

For those wondering "what about the login box on the homepage?". There is another bug to improve that and make it easier to log in from any page! Bug 476090 will allow users to login directly from any page without needing to leave the context that they are in. Hopefully in the future we'll be able to do this ajax style to avoid having to leave the page at all.

Can't wait to hear your feedback about both of these bugs.

Planet Mozilla Test

2008-08-31T17:30:00.001-07:00

testing!