Rijksmuseum

ABOUT OUR PROJECT

A formal report describing the results of a heuristic evaluation for Rijksmuseum’s website and mobile interface. The research conducted is based on Jakob Nielsen’s Ten Usability Heuristics and was submitted for INFO644: Usability Theory & Practice course at Pratt School of Information.

DATE

February 22, 2020

RESEARCH METHOD

Heuristic Evaluation

DESIGN TOOLS

Adobe InDesign

MY ROLE

Our team worked collaboratively to submit redesigned web and mobile user flows and a high-fidelity prototype as our final products.

My roles included:

• Conducting two semi-structured interviews and two observations

• Conducting two card sorting studies and two tree testing studies

• Conducting two in-person remote “think aloud” usability evaluations with low-fi prototypes

• Analyzing and consolidating usability problems and writing individual research briefs

• Creating a paper low-fi prototype (mobile + desktop) for our team

• Creating and presenting final presentation deck for high-fi prototype

TEAM MEMBERS

Nora Gordon

Ting Wang

Kaige Zheng

SCOPE

New York Cares was an early adopter of technology but their current website does not match the ease of their product. Divided into groups of 3-4, my team framed our challenge as:

Client’s Goals

New York Cares laid out four redesign goals:

1. An improved information architecture

2. Design consistency

3. Improved search functionality

4. Improved mobile experience

Our Solutions

The solutions we came up with are:

1. Design a minimalist information architecture that prioritizes increased information clarity

2. Streamline search process that prioritizes search bar and filters

3. Employ a clean, consistent, and approachable style identity

4. Use responsive design for mobile experience

Observations

“Imaging yourself registering for an event of interest and narrate your thoughts and feelings.”

Interviews

“What do you value when it comes to volunteering? What do you hope to get out of this experience?”

Questionnaires

What is your reason for volunteering? How often do you volunteer?

KEY FINDINGS

From there, we continued working on our personas. Two major takeaways were gathered from our process are:

1. First-time volunteers want to be confident in what they sign up for

2. Big moving buttons are favored over the abundance of text

3. Young, recent New Yorkers are on the lookout for activities to do (both day & night)

Some of the key design recommendations features we found from the six dimensions include:

1. Homepage: search-based, minimalist in design

2. Navigation: global navigation with 2-3 main items and sticky navigations

3. Search-bar: front and centered, narrow search-bar with zip-code search

4. Search results page: card and calendar mode with color-coded results and hovering effects

5. Item page: include a variety of images, weighted fonts, filtered jumps, ‘back to results’ search

6. Mobile: minimalist design with a prominent search-bar and hamburger navigation

CARD SORTING

After the competitive reviews, a closed card-sorting was conducted with the current navigation. Participants matched 26 cards to various search filters and volunteering causes. Overall, the results went smoothly but we found participants struggled most with broad labels and grouping volunteering causes.

TREE TESTING

We then conducted a tree test using three tasks. The results were rough. Our 8 participants “failed” intended tasks due to labeling and placement confusion. This may be due to an unclear site-wide search, ambiguous labels, and different preferences for search filters. The results helped us narrow down our labels for the revised information architecture.

USER FLOWS

After the site-map creation, the next phase was creating our user flows and wire-framing. Our team designed four task flows for New York Cares’ three primary user groups of volunteers, donators, and nonprofits. We matched each user group to the following desktop/mobile tasks based on previous findings that suggest:

• Volunteers use both desktop/mobile to seek opportunities

• Donators use their mobile to donate

• Nonprofits use their desktop to seek volunteers.

DEVELOP TASKS

Here are our two desktop and two mobile tasks:

PAPER PROTOTYPE

From there, we each sketched out our own versions for the desktop/mobile user flows and created a new paper prototype uploaded onto InVision.

Desktop Final Prototype

User Flow #1: “Find an individual volunteer opportunity in Brooklyn to work with animals or the environment on weekends.

Mobile Final Prototype

User Flow #2: “Donate $100 to New York Cares.”

CLIENT FEEDBACK

REFLECTION

Meeting & Future Considerations
To conclude, we presented our final prototypes to New York Cares and our classmates on December 16, 2019. Each group gave a 10-minute presentation that included desktop and mobile walkthroughs.

Our group received positive feedbacks. New York Cares enjoyed our low-fidelity prototype user evaluations, homepage portals, and how we played with accent colors but still kept to their original identity.

This was my first collaborative design project at Pratt. It was challenging, time-consuming, but highly rewarding to be able to work with real clients and deliver a successful product for a non-profit organization. Some things I will consider next time are:

• Getting involved
  Sign-up and volunteer through New York Cares’ to better understand its users

• Practice!
  Be comfortable with InVision and Adobe XD and create even more beautiful prototypes

• Setting clear deadlines
  Recruit more users for card sorting and tree testing to better refine our information architecture