Author Topic: Feedback Needed to Help Design Usability Improvements! (Read 12018 times)

Dave Greenberg · March 28, 2008, 06:42:44 pm

Calling all regular CiviCRM users.... we are working with Zoey Kroll from CivicActions, who is a Usability professional, to develop recommendations for both short and medium term improvements we can make to CiviCRM. For now, we are focusing on the Contact Summary and Search screens - as we believe that these are two of the most commonly used functions.

You can help this effort greatly by taking a few minutes to answer the questions below. Please post your feedback directly to this forum topic.

1. What do you use CiviCRM for?
For example: I use CiviCRM for our contributions database, our donors database, and our customer database.

2. What are the most common scenarios in which you use CiviCRM (that specifically involve the Contact Summary or Search Results pages)?
For example: After receiving a few contribution checks, I go to the specific contacts to record their contributions.

3. Describe the click path you use to accomplish your actions.
For example: Home>Search Results page>Contact Summary>Contact: Contributions tab>New Contributions

4. What are your "pain points" on the Contact Summary or Search Results pages (screenshots below)? Do you have any specific recommendations as to how to improve them?

lcdweb · March 29, 2008, 06:15:46 pm

This is a great discussion topic -- one I'm sure to be very opinionated about (sorry!). Here are my initial answers to the questions, and some initial thoughts for ways to improve usability.

1) I am a freelance developer, so I have a number of clients using CiviCRM. Most are member-based professional and trade associations. They use CiviCRM as their central contact database, to manage membership in the association, provide online event registration, and track payments related to these and other activities. As much as possible, I want them to be able to rely on CiviCRM as the sole data management tool. I have a few additional charitable organization clients that use CiviCRM for online donations.

2) The contact summary/edit and search pages are definitely the most used pages. Here are a few scenarios:
a) member emails or calls with changes to contact information (contact edit screen);
b) dues payment received by mail (check). Search for contact, select membership tab, and enter/update membership record. Go to Contribution tab and enter corresponding payment (I don't have any clients actually using 2.0 in a live environment yet, where the contribution entry is available in the membership and event record);
c) event registration received by mail. Similar process as dues, but with the event tab.
d) new contact received. Search to determine if contact already exists in the db. If not, create new contact. Create relationship to parent company (if appropriate).

3) a) Home > Find Contact > Contact Summary > Edit Contact
b) Home > Find Contact > Contact Summary > Membership Tab > Edit Membership > Contribution Tab > Add offline contribution
c) Home > Find Contact > Contact Summary > Event Tab > Edit/Add Registration > Contribution Tab > Add offline contribution
d) Home > Find Contact > Add Contact > Relationship Tab > Create Relationship

Note: in <1.9, I found the find contact field in the sidebar to be unreliable, thus the need to go to the find contact page. In 2.0 I've found it to be much more usable.

4) In general, I think the pages lack visual organization and inefficiently use space. I find this to be true throughout the default CiviCRM theme. There's a lot of white space (not good white space, but disorganized white space). And the fields are not organized as logically as I would want. This results in the user needing to scroll down the page quite often (the edit contact page is a good example of where this is particularly true). I think the collapsible regions are a good concept, but are overused, and consequently make more clicking for the user. While I think the typical behavior where fields with no value set are not shown on the contact summary page, I think this could create some confusion. As a user, my preference is to see all available fields so I know which ones lack data (though I realize that's likely not a preference for many people).

Another pain area is that there are a number of areas in the tool where it seems *one* more click is required than is desirable. Or areas where multiple successive screen refreshes are required in order to walk through a certain process (for example, registering for an event causes a screen refresh when selecting the specific event and when selecting the participant type). That definitely impacts usability (I get a lot of comments from clients about that aspect).

On a side note, with regard to the page efficiency/layout issue, I'm working on revamping the templates and stylesheets for a client to improve those aspects. I hope to then make that revised "theme" available to other users for comment, or at least to use as a base to make their own modifications.

-Brian

Dave Greenberg · March 30, 2008, 02:46:21 pm

Quote from: lcdweb on March 29, 2008, 06:15:46 pm

4) In general, I think the pages lack visual organization and inefficiently use space. I find this to be true throughout the default CiviCRM theme. There's a lot of white space (not good white space, but disorganized white space). And the fields are not organized as logically as I would want. This results in the user needing to scroll down the page quite often (the edit contact page is a good example of where this is particularly true). I think the collapsible regions are a good concept, but are overused, and consequently make more clicking for the user. While I think the typical behavior where fields with no value set are not shown on the contact summary page, I think this could create some confusion. As a user, my preference is to see all available fields so I know which ones lack data (though I realize that's likely not a preference for many people).
On a side note, with regard to the page efficiency/layout issue, I'm working on revamping the templates and stylesheets for a client to improve those aspects. I hope to then make that revised "theme" available to other users for comment, or at least to use as a base to make their own modifications.

Brian - It would be awesome if you could share your layout revisions with us sometime prior to April 20th. We could then use those as inputs for the layout improvement process for 2.1 we're going to work on during our New Zealand meetup (i.e. combine them w/ the suggested changes that come from Zoey's analysis and other responses to this thread). I tend to agree about not hiding elements (e.g. Job Title, Website etc.) which are empty - and hopefully that change will fit nicely with an improved, more space-efficient layout for the contact summary page in particular. I'd be interested in seeing more specifics on improvements to the contact Edit form (esp w/ regard to the collapsible region issue you mentioned).

Quote from: lcdweb on March 29, 2008, 06:15:46 pm

Another pain area is that there are a number of areas in the tool where it seems *one* more click is required than is desirable. Or areas where multiple successive screen refreshes are required in order to walk through a certain process (for example, registering for an event causes a screen refresh when selecting the specific event and when selecting the participant type). That definitely impacts usability (I get a lot of comments from clients about that aspect).

These screen reloads came up several times at NTEN as pain points as well. We've added a high priority item on the 2.1 roadmap to come up with an Ajax-based solution for conditionally loading custom fields etc. and we are optimistic that we will be able to eliminate this issue completely.

andrewhunt · March 31, 2008, 08:12:15 am

1. I use CiviCRM for three organizations I'm involved with, all using Joomla!. We use it for tracking memberships, contributions, prospective and active volunteers, and our mass e-mail.

2. The most common ways that we use contact pages are updating contact information and relationships. One organization is a network of 27 grassroots groups, and we spend a lot of time recording relationships between individuals and organizations. We also record offline contributions and memberships.

We rarely use the simple "Find Contacts" search for results--it's generally just to pull up a specific contact. We use the Advanced Search and Search Builder search results screen for several tasks: exporting lists for mail merge, creating mailing labels, and creating smart groups. I think the search results page is a bit daunting for novice users, but it's functional.

3. Home>Search Results Page>Contact Summary>Contributions tab>Add new offline contribution
Home>Search Results Page>Contact Summary>Edit Contact
Home>Search Results Page>Contact Summary>Relationships tab>Add new relationship>$#*% I don't have a household yet>Contact Summary>Edit Contact>set up address with new household>search for other household member(s)>Contact Summary>Edit contact>add existing household address

4. All the refreshes from the various drop-downs really get annoying.
It's not clear whether your selections stick when you navigate to a second page of search results. In other words, if I want to select records 1, 5, 15, 52, and 63, I'm not confident that the selections of 1, 5, and 15 will be recorded when I go to the second page of results to select 52 and 63.
As I said above, I practically never use the contact search to select someone I don't know the name of. When results appear as I type in the box on the left, it seems as if they're just there to mock me--I wish I could click on those and go straight to that contact's summary. (like Facebook)

Eileen · April 03, 2008, 03:49:32 am

Quote

1. What do you use CiviCRM for?

We use CiviCRM for managing enrolments for circus classes. It's still quite new to us but it enables people to enrol themselves into classes they wish to do and manage their own details. It is also our contacts database. It replaces an Access database. We have about 400-500 people on our mailing list - which we export from CiviCRM and mail merge to using external tools at this stage. I aspire to add timesheeting for the tutors (via custom fields for participants).

Quote

2. What are the most common scenarios in which you use CiviCRM (that specifically involve the Contact Summary or Search Results pages)?

In order to add someone else to an event you need to search for them, go into their personal record, click on the events tab and then add them to the event. As someone else noted, I am normally looking for a specific individual.

Quote

3. Describe the click path you use to accomplish your actions.

Pretty much as described above.

Quote

4. What are your "pain points" on the Contact Summary or Search Results pages (screenshots below)? Do you have any specific recommendations as to how to improve them?

This seems a pretty long way around to add someone to an event. I am usually starting from a participants search and then realising someone needs to be added and going around the loop to add them.

In my ideal world the default screen returned from the search would be front-end configurable so in Administer CiviCRM you could set the columns returned for that search page for the site. I would then deselect the columns 'state', 'postal' and 'county' and put in their place a direct link to the events page for that contact and to the 'contributions' page.

I like the way the contacts details looks on the 'view' page and would find it easy to edit the details if each section had an edit button rather than having to go into the whole edit page (which I find pretty daunting - I think other people may have made suggestions on that). The page on the view tab requires us to use the scroll bar to see the three custom fields we have added which is not great and would probably be quite painful for someone with a lot of custom fields.

Re: the edit page - it would be good to be able to configure some fields not to appear. We don't have States in New Zealand so that would be gone for starters. There are also width issues - in particular in the name and greeting section.

Also, in IE the dojo search bar is a bit painful as you have to hit enter twice or click on the search button whereas you only need to once in Firefox.

Dave Greenberg · April 03, 2008, 10:37:39 am

Eileen - Thanks for input and suggestions. We'll be pulling these together and coming up with some improvements over the coming weeks.

Meanwhile, you CAN eliminate the "State / Province" field from the Edit form and the Contact Summary Display by unchecking it in:
Administer CiviCRM >> Global Settingds >> Address Settings >> Address Editing checkboxes

... and removing the {contact.state_province} token from the Address Display field on that same screen :-)

ClayWhipkey · April 04, 2008, 11:59:35 am

Quote

1. What do you use CiviCRM for?
For example: I use CiviCRM for our contributions database, our donors database, and our customer database.

Right now I'm only using it for my primary contracted employer. We are a non-profit consortium for OpenCourseWare (free learning online). The consortium has member organizations, which has several relationships to individuals like employee, lead contact, certifier, voter, etc. I'm using Joomla 1.0.13 (CiviCRM 1.9.13019) right now, but we are looking at upgrading to 1.5 if the integration with CiviCRM is better there.

We are using CiviMember, but only to be able to create smart groups for mailing. We use CiviMail a lot. We actually control memberships using specific groups, with a custom application that puts the new org in a pending group, and an approval system that puts them in an approved group. I use the API a lot, although I believe our scenario is not that unusual (similar to the Kabissa project) and the concept could be integrated into CiviMember for generalized distribution.

Quote

2. What are the most common scenarios in which you use CiviCRM (that specifically involve the Contact Summary or Search Results pages)?

Mainly looking up contacts for the purpose of sending emails or checking if they have a necessary relationship.

Quote

3. Describe the click path you use to accomplish your actions.
For example: Home>Search Results page>Contact Summary>Contact: Contributions tab>New Contributions

Home>Find Contacts>search (I have used the multiple selection option on the search results on occasion to perform mass actions. )
Home>Find Contacts>Search Results page>Contact Summary>Relationship tab>click on related contact name

Quote

4. What are your "pain points" on the Contact Summary or Search Results pages (screenshots below)? Do you have any specific recommendations as to how to improve them?

Due to our structure, with orgs and related individuals, the biggest pain right now is searching. Especially for the purpose of creating groups for CiviMail. We would LOVE to be able to do more advanced searches. Examples:

get lead contacts(relationship type) for organizations who do or do not have at least one voter relationship with an individual
get all employees (relationship type) for organizations who meet some existing search criteria

Contact screens feel pretty slow, although we are on a shared host. But we frequently go into contacts and view other tabs, and it takes a while to get around (why does it have to refresh the page when you click on the expander in the Activities tab?). Also, there are some properties that don't seem to be available unless you are in edit mode, like Current Employer. (I know you can see the relationship, but again, you have to move slowly to that tab.)

Another note about searching for contacts: I think wildcard search should be the default. Its annoying to have to wrap everything with %, and I have to train non-technical users how to do that. I think making search easier in this way provides a lot more value than what you lose by getting a couple extra contacts in your results.

We would also love for CiviMail to be able to expose tokens for related contacts, but I know that is a lot of logic to do.

zoeyk · April 04, 2008, 12:40:46 pm

Hi Brian, Thanks for the detailed feedback. I have a few follow-up questions:

Quote from: lcdweb on March 29, 2008, 06:15:46 pm

Note: in <1.9, I found the find contact field in the sidebar to be unreliable, thus the need to go to the find contact page. In 2.0 I've found it to be much more usable.

Is 2.0 an improvement because the interface shows a list of names as you type, which you can then select? Or are there other differences in functionality/interface that you are referring to?

Quote from: lcdweb on March 29, 2008, 06:15:46 pm

On a side note, with regard to the page efficiency/layout issue, I'm working on revamping the templates and stylesheets for a client to improve those aspects. I hope to then make that revised "theme" available to other users for comment, or at least to use as a base to make their own modifications.

It would be great to get any examples of this ASAP as they could be immensely helpful! Are other people in the community revamping templates/stylesheets to improve usability? I'd love to talk to anyone involved in creating community-based design solutions!

zoeyk · April 04, 2008, 12:49:00 pm

Hi Andrew, Zoey here.

Quote from: andrewhunt on March 31, 2008, 08:12:15 am

I think the search results page is a bit daunting for novice users, but it's functional.

Can you specify why it's daunting to novice users, and what you think would improve it?

Quote from: andrewhunt on March 31, 2008, 08:12:15 am

Home>Search Results Page>Contact Summary>Relationships tab>Add new relationship>$#*% I don't have a household yet>Contact Summary>Edit Contact>set up address with new household>search for other household member(s)>Contact Summary>Edit contact>add existing household address

Sounds like this circuitous path is not fun for you

What would be your ideal route here?

Quote from: andrewhunt on March 31, 2008, 08:12:15 am

As I said above, I practically never use the contact search to select someone I don't know the name of. When results appear as I type in the box on the left, it seems as if they're just there to mock me--I wish I could click on those and go straight to that contact's summary. (like Facebook)

Do you mean: even though it suggests a name as you type, when you select this name you still end up at the search results page? And that, instead, you wish it would take you directly to the contact summary for that name?

lcdweb · April 04, 2008, 12:54:01 pm

zoeyk --

On the sidebar search -- I find it more reliable in 2.0 (I would frequently get errors if I typed too fast in previous versions), it loads data faster, and when you select a record from the result set with enter, it loads the record, which is definitely the desired behavior.

I hope to put the demo style sheets and templates on the forums for input by next week. I'm redesigning them as part of client project, and am under the gun with it (which is good, because it puts pressure on me to get them done!).

-Brian

Eileen · April 04, 2008, 01:11:13 pm

I didn't say this so I don't know what the person meant but I do have an opinion

Quote

Do you mean: even though it suggests a name as you type, when you select this name you still end up at the search results page? And that, instead, you wish it would take you directly to the contact summary for that name?

Yes, the above is what it does in Firefox. In IE it doesn't even take you to the search results page and yes, I do wish it would take me directly to the contact I select.

NB - in all three cases I am refering to when I hit enter as opposed to click on search

Sarah · April 06, 2008, 01:08:15 pm

1. What do you use CiviCRM for?
For example: I use CiviCRM for our contributions database, our donors database, and our customer database.
Several offices nationally are involved in pilot programs converting to civicrm. The work we support usually involves some type of community organizing work. We collect names on line and off line for donors, volunteers and petitions. In addition to these contacts there are also contacts related to specific contacts for program work, such as educators, or lobbyists. Each office has several issue areas of program work, some staffed by many and some only staffed by one.

2. What are the most common scenarios in which you use CiviCRM (that specifically involve the Contact Summary or Search Results pages)?
Lists for mass mailings to donors, mass email to supporters, look up contact address, email or telephone information, volunteer search, record offline donations and activities

3. Describe the click path you use to accomplish your actions.
For example: Home>Search Results page>Contact Summary>Contact: Contributions tab>New Contributions
For most things that I need frequently I have created links in the side menu, and added all the modules in the top menu, otherwise this is how I might do some things..
CiviCRM>>ManageGroups>>Members - for the mailing list members
CiviCRM>>Advanced Search – for contact searches

4. What are your "pain points" on the Contact Summary or Search Results pages (screenshots below)? Do you have any specific recommendations as to how to improve them?
Complaints I have had from users are on the search screen, they only want to be able to see help or instructional items, when they are beginning. The said once they understand how to use the database, having the instructions there is intrusive.
Also the use of whitespace and the display of contacts was an issue for them. They wanted to display many more contacts on a page, and be able to select contacts across several pages.

zoeyk · April 08, 2008, 12:06:26 am

Quote from: Eileen on April 04, 2008, 01:11:13 pm

I didn't say this so I don't know what the person meant but I do have an opinion

Quote
Do you mean: even though it suggests a name as you type, when you select this name you still end up at the search results page? And that, instead, you wish it would take you directly to the contact summary for that name?

Yes, the above is what it does in Firefox. In IE it doesn't even take you to the search results page and yes, I do wish it would take me directly to the contact I select.

NB - in all three cases I am refering to when I hit enter as opposed to click on search

Thanks for chiming in Eileen (and for the detailed feedback earlier). It's all useful info to hear as we reconsider these pages!

zoeyk · April 10, 2008, 05:08:43 pm

How much are people using the alpha-filter at the top of the Search Results page? Currently it has a prominent position on the interface and I'm wondering if we could remove this altogether on this page. If you use the alpha-filter, can you describe the scenario you use it for and the click path. Thanks!
-Zoey

lcdweb · April 10, 2008, 05:59:56 pm

For large result sets, I think it's pretty useful. I actually would like to be able to easily include the alpha filter on frontend search result pages. Lobo did a post or wiki article on how to do that a while back, but as I recall, it was pretty involved. Might be nice to have that more easily implementable.

CiviCRM Community Forums (archive)

News:

Author Topic: Feedback Needed to Help Design Usability Improvements! (Read 12018 times)

Dave Greenberg

Feedback Needed to Help Design Usability Improvements!

lcdweb

Re: Feedback Needed to Help Design Usability Improvements!

Dave Greenberg

Re: Feedback Needed to Help Design Usability Improvements!

andrewhunt

Re: Feedback Needed to Help Design Usability Improvements!

Eileen

Re: Feedback Needed to Help Design Usability Improvements!

Dave Greenberg

Re: Feedback Needed to Help Design Usability Improvements!

ClayWhipkey

Re: Feedback Needed to Help Design Usability Improvements!

zoeyk

Re: Feedback Needed to Help Design Usability Improvements!

zoeyk

Re: Feedback Needed to Help Design Usability Improvements!

lcdweb

Re: Feedback Needed to Help Design Usability Improvements!

Eileen

Re: Feedback Needed to Help Design Usability Improvements!

Sarah

Re: Feedback Needed to Help Design Usability Improvements!

zoeyk

Re: Feedback Needed to Help Design Usability Improvements!

zoeyk

Re: Feedback Needed to Help Design Usability Improvements!

lcdweb

Re: Feedback Needed to Help Design Usability Improvements!