Usability Study using Heuristic Evaluation — Meetup
Meetup came up with a brand new identity and an updated interface recently. For folks who don’t know what Meetup is, here is a snapshot of their “About Us” page.
I evaluated their new interface based on heuristic evaluation guidelines set by Rolf Molich and Jakob Nielsen, popularly known as “Jakob Nielsen’s ten usability guidelines”. These guidelines include studying the interface from these 10 points of view :
- Visibility of System Status
- Match between system and the real world
- User Control and freedom
- Consistency and Standards
- Error Prevention
- Recognition rather than recall
- Flexibility & Efficiency
- Aesthetic & Minimalist Design
- Recovery
- Help and documentation
In this study, I have modified the first point from “Visibility of system status” to “visibility of the interface”.
The article is long but is adequately supplemented by pictures to make the point. Here it goes :
1. Visibility of the interface
Nielsen says
The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.
- The search function in meetup is excellent. It lets the user search using location and distance filters to find the most appropriate meetups in the user’s area or the area the user is planning to visit. I like the way filter hyperlinks are organised within a sentence that contribute to a user story. It even lets you sort the search results based upon different groups organizing the meetups or the Calendar.
- The RSVP section for a meetup looks like this in its default state
It changes to this once the user clicks on “Yes”. This provides the user feedback about system status at the same time an opportunity to make the experience better for him by inviting a friend.
If the user clicks on “No” from the initial photo, it shows this screen.
Notice the change in color of background of the same tile. It goes from a neutral white, to a positive Cyan to a dull, sullen gray. This is an example of emotional design using color.
There were a couple of things I did not like about the interface’s visibility :
- The user needs to scroll down a lot to look at “Other Meetups similar to this”. This information could have been organised better.
- The deadline for RSVPing is the page is displayed in really small font as compared to other things. I feel it should be the opposite. You don’t want a situation where the user checked out the event and couldn’t go because he “missed the deadline”.
2. Match between Real World & System
Nielsen says
The system should speak the users’ language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.
The language used on the interface is very easy to understand and relatable to the real world. The buttons and navigation headers are clear and crisp and the system speaks the user’s language.
I could not find an isolated incident where meetup under performs here.
3. User Control and Freedom
Nielsen says
Users often choose system functions by mistake and will need a clearly marked “emergency exit” to leave the unwanted state without having to go through an extended dialogue. Support undo and redo.
- Meetup gives the user option to cancel RSVP to and event.
- Gives the user option to leave a group.
- An important thing to follow while designing interfaces is to tell the user about “where they are” and “where they can go” . This screenshot is an example of all information a person may need to decide if they want to go to the meetup.
- Once the user goes to the page of a Group, all information he could need about the group(Description, Members, Upcoming events, organizers, description of past meetups) neatly presents itself without scrolling. That is an example of good information architecture.
4. Consistency and Standards
Nielsen says
Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions.
The meetup website and android interfaces follow the regular web and android standards. The navigation bar presents itself at the top for better access. The icons for profile, search and others are indicative of the actions they are to be used for.
The icons and color is consistent through different platforms ( Web and Android studied). The meetups which can be signed up for present themselves in red, the primary interface color. The meetups not available are presented in cyan.
Clicking on the group button in both web and Android lead to Group pages with similar information architecture ( where the same information in presented in similar areas). This gives visual consistency to the product as a whole.
Overall, meetup has built cross platform consistency of color, icons, situations and actions.
5. Error Prevention
Nielsen says
Even better than good error messages is a careful design which prevents a problem from occurring in the first place.
Since the only task a user performs is either signing up for a meetup or group, I evaluated the error prevention when the user tries to cancel RSVP to an event he registered for.
This is the image that shows up when the user clicks on the cancel event button
Asks the user again if “he’s going”. A generic approach to this pop-up would be to ask if “the user is sure he wants to cancel”. I like the meetup approach. It lets the user think about “going to the event” rather than “cancelling registration”. Tiny details matter.
It also tries to change the user’s mind by asking if he’s bringing guests. It’s only logical the experience will be better if he’s bringing someone along.
6. Recognition rather than recall
Nielsen says
Make objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.
I have covered a few points that should be here in the visibility part of the article.
Apart from that, I really liked the way meetup organised my meetups in the form of an on-screen calendar which could be synced easily with my personal Calendar, like the Google Calendar.
- One thing I hated about the interface was that the user is not informed that he has to “Pay” to create a meetup until he spends time filling information about the meetup ( A TOTAL OF 5 SCREENS ). There is no mention of pricing on the home page, before you create an account or after you log in. This is a bad case of withholding information from the customer until it needs to be presented ( when he pays ).
7. Flexibility and Efficiency of Use
Nielsen says
Accelerators — unseen by the novice user — may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.
Meetup hasn’t got a lot in terms of tasks a user can accomplish. There isn’t much to be discussed here.
I really like the way the user does not need to know what exactly he is searching for.They have neatly presented all the website offers in the search recommendations window. This is a beautiful example of how a exploratory search function can lead to better engagement.
8. Aesthetic and Minimalist Design
Nielsen says
Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.
This part is split up into 4 sub-parts :
- Contrast — Primary color red is consistent throughout and enforces a good brand identity. A minimalistic white background with black text is standard and keeps user’s focus on what is important. The red buttons pop out and color establishes emotion as explained in the visibility point.
- Repetition — The colors red, cyan, white, and gray are repeated along with a constant black for text. The icons are repeated across platforms ( web and android).
- Alignment — Follows the established left alignment for most objects with right or center alignment for objects that need to be set apart.
- Proximity — Content and Action Buttons are appropriately placed with good spacing. Even on the android app, there is enough spacing so that a user looking to tap “A” doesn’t tap “B”.
9. Help users recognize, diagnose, and recover from errors
Nielsen says
Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.
- When you search for a keyword that is not there on the website, like I did with “aerial karate”, this image pops-up
The redirection feature does okay. The use of a friendly, engaging animation would have better.
- What happens when you are trying to create an account on meetup ( People hardly do that now, most just sign up via Facebook or Google) ? But if there is a feature, it should work properly, right ? This is the screen that showed up when i tried to create a new account by entering my own email ID and details ( I already have an account ) .
This is after I have entered details at the bottom of screenshot once already. They didn’t even tell me that an account with this name and email is already existing, terming it is “Sorry, there was a problem”.
Maybe it was a bug, but meetup performs really bad here.
10. Help and Documentation
Nielsen says
Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user’s task, list concrete steps to be carried out, and not be too large.
The help center in the web interface is really well designed and offers support for a large array of problems in a neatly categorized way. The FAQ section is also up to the mark.
Well That’s it !
The evaluation comes to an abrupt end. I do not have any overall rating or suggestions for meetup. The objective of the post was to bring out my point of view upon Meetup’s usability. Feedback on the article and study would be appreciated.
Thanks for reading. If you like it, share it !
