Design Story: Materials for the Arts

Scope

Initial interviews with Materials for the Arts (MFTA) revealed the organization’s key goals in a website redesign. The organization would like its users to be informed of the different opportunities it provides beyond donations and scheduled appointments. In order to insure that prospective users are efficiently and effectively exploring the interface a series of user interviews and observations were performed by a Pratt research team.  

Problem

Interaction with users is limited and lacks communication, preventing the organization from growing a user following.

Ask

Design a new responsive website architecture, using insights gathered from user research.

My Role

Our team was comprised of four researchers including myself. Within the team I served as copywriter, providing context and discussion around our design choices and user insights. Outside of this role I conducted user interviews and testing throughout the process, and offered input in all design choices.

Process

MFTA website redesign process consisted of six stages

  • User Interviews & Insights
  • Card Sorting
  • Tree Testing
  • Sitemap
  • Competitive Analysis
  • Prototype

User Interviews 

We interviewed eight participants that illustrated MFTA’s key user demographic. Participants were artists, educators, non-profit employees, and previous MFTA users. The team developed a universal interview and observation guide to address the concerns of the MFTA, while also providing for targeted questions and tasks to be addressed while users interacted with the current website design. From these interviews we extracted common themes. We then created MFTA’s user personas and established user insights.

Affinity Diagram of User Feedback & Insights

Personas

In order to work with the user and not for the user, we created personas that reflect MFTA’s typical user demographic.

User Persona Overview


Detailed User Persona

 

Insights

  1. Users will engage if the process is easy
  2. People don’t want to schedule time for their generosity
  3. They will donate to organizations that are relatable

Our data implies that users care about causes like MFTA, but the process to engage is complex and requires that the user is already familiar with the donation and shopping  procedure. At the MFTA, users need to plan an appointment in advance. Suddenly, a gift-giving experience, which should be free and easy has become a responsibility.Lastly, users have trouble relating to the organization as the website uses jargon that only those with MFTA experience will recognize. Our users want to belong to a part of community and support organizations of real people.

Card Sort

For this next stage, the research team recruited eight participants for an open card sort test. Participants were asked to place 42 different topics into groups (i.e. lesson plans, volunteer application, press, etc.), and to then label these groups.

User Participating in Card Sort

Most participants created similar groupings of topics, however participants exhibited placement inconsistencies with three topics:

  1. Jobs & Internships
  2. Artist Workshops
  3. Scheduling an Appointment

In step 3, the tree test, special attention was designated to these topic areas by the Pratt team

Tree Test

Based on the hierarchical structure and topic groupings created in the card sort, a tree test was created. The tree test is the proposed site hierarchy in its most basic form, without navigation or design elements. For this test, ten new participants were tested, two of which were recommended to the team through MFTA’s provided contact list.

 

Participants were asked to complete seven tasks, while navigating through the proposed site hierarchy, to discover usability. Task  Example:

“You run a school club and you want to take your club to MFTA in order to fulfill community service hours. Where would you go?”

User Participating in Tree Test

Participants displayed inconsistencies locating “Jobs & Internships” and “Artist Workshops,” so these were relocated in the final site map.

SiteMap

 

Content Structure

Based on the prior research from steps 2 and 3, the team broke down the website into primary and secondary ways in which users may navigate the MFTA proposed website.

Detailed Content Structure

User Flow

After organizing the content categories of the site, we then visualized how the user would navigate MFTA’s redesigned website. Below is our spoke-style chart. An example user journey through the content would be:  a page with “Article-style” content like volunteer information can lead to a Form to sign up to become a volunteer.

Sitemap Design

As mentioned previously, during step 3, tree test, participants displayed inconsistencies locating the pages “Jobs & Internships” and “Artist Workshops. Jobs & Internships had been under the About menu; it is now under Get Involved.  Artist Workshops had been under a now-defunct Education & Workshops menu, it is now a category on the Events calendar.

Detailed Sitemap

 

Competitive Analysis

 

Understanding the competition

We evaluated four non-profit organization websites based on their events, donations and volunteering web pages.

Free Arts NYC

Museum of the City of New York

New York Cares

City Arts

We placed these sites on a heuristics scale of 1-4 to test for clarity in design, brevity or ease of use and visual impact. Acquiring inspiration from these sites, and focusing on MFTA’s organizational mission we developed MTFA’s design principles.

Key Design Principles

Simplicity – Only highlight core tasks to the user. Limit text and photos as not to overload user visually

Aesthetics – Clear bold and colorful photos. Bring art forward and text back, and ensure a cohesive design across all pages

Relatability – Use language that is accessible and limit jargon. Create an empathetic approach to users and one that is unassuming, and show off the community

Brevity –  Should be of the utmost importance on MFTA’s new website. Focus only on information that is informative to the user

 

Prototype

The scope of the prototype was built around three common tasks that users take on the MFTA website:

1. Finding and registering for events

2. Signing up to volunteer

3. Donating materials

These tasks were given emphasis because based on our research they are among the most complex tasks users will do on the website, and therefore require the most attention and care.  MFTA specifically mentioned that they would like the mobile website to be as comprehensive as the desktop, because on the current platform, users were abandoning their search because of confusing mobile site.  

Finding and Registering for an Event

In the initial interviews we had with users, they talked to us about how they search for events in New York City. There were many different entry points the participants chose (eventbrite, google, google maps, etc.). However, one thing stood out, users may be looking for a specific day to attend an event or a specific event and are flexible on the date. Thus for our events page we thought it was useful to have a small calendar along with the type of events. We also included a drop down menu, to showcase the three different events that take place at MFTA, eliminating the need for a user to have a mental model of what is on offer at the organization.  

Desktop Events Page

 

Volunteering with the Organization

Volunteering is one of the many ways to give back to the community and MFTA. We broke Volunteering at MFTA into four categories: Individual Volunteer, Group Volunteering, Corporate Partnerships, School Partnerships. Currently just Individual and Group exist on the MFTA site. We wanted to showcase all the ways people and groups may volunteer their time. Once a user choses their ideal volunteer category, they are lead straight to a sign up form, as all the information they need to commit is up front on the site page. Final Prototypes can be viewed here: Desktop : Mobile

Desktop Volunteer Page

 

Desktop Volunteer Form

Donation Page

MFTA was upfront during initial interviews that they wanted more donors. And for MFTA donor means more than dollars it means things (art materials, electronics, fabrics, etc.) as well. They wanted to let people know how to donate and reuse materials in a clear manner. Therefore, when designing the donation page, we wanted the user to know how to donate, and what was possible to donate, eliminating the need for follow up phone calls to the already busy organization. 

Desktop Donation Page

 

Reflection

Throughout the project we were grappling with the language to include on the site, as much of the site had an exclusive lexicon, and we felt we had to rework much of the language without MTFA input. Usually organizations chose words for a reason, but we were not able to work with them or their current users on this aspect, limiting our confidence in our word choices. Beyond limitations, I think we were able to pinpoint MFTA’s main architectural issues, into three main areas, allowing for an easy to manage presentation to the client, and limiting the clients from feelings overwhelmed.

 

 

 

The Design Sprint – Another Discount Method?

Introduction

I first came across the Design Sprint when a colleague sent me an article about how the Phoenix Museum selected the process to reimagine their visitor’s guide. The Museum had just underwent a rebranding, and the staff wanted to find a way engage the visitors in a more informal way. The sprint was run because it brought more voices into the room (diverse staff), produced a working prototype quickly, and provided user feedback, all in one week. Working in a Museum myself, I wanted to know more about the Design Sprint.

 

History

The Design Sprint was developed by Jake Knapp, who was working for Google at the time. He wanted to figure out a way to make his time more productive and developed the Sprint. It  was then tested on Chrome, Google Ventures and Gmail. Having success, the Design Sprint was moved to Google Ventures. Google Ventures invests about 300 million dollars a year to help startup companies develop products and test those products. To save money and make money, startups could use the Design Sprint to launch new products and ideas, and determine if on the right track with little risk involved. Knapp states in his book: “Working together in a sprint, you can shortcut the endless-debate cycle and compress months of time into a single week. Instead of waiting to launch a minimal product to understand if an idea is any good, you’ll get clear data from a realistic prototype. The sprint gives you a superpower: You can fast-forward into the future to see your finished product and customer reactions, before making any expensive commitments.”

 

Method

The Design Sprint has been used with many companies such as Slack, Blue Bottle Coffee and Savioke. The Sprint typically takes five days and is run by Google Ventures, but is also adaptable for anyone to run at any company or organization. Knapp states: “Sprints offer a path to solve big problems, test new ideas, get more done, and do it faster.”

The first step is creating a team or group of people to start a sprint. This team should consist of no more than seven people. In a group there should be a “decider,” someone who makes the difficult decisions. It is recommended that this person be the CEO, Chief Designer, Manager, etc. The group will also need a facilitator. The Facilitator gives the group positive encouragement, keeps time and the group on track. The other five members should come from different departments within the company or organization, to offer a diverse perspective. Once the team is established, everyone must clear their calendar for five days and commit to the Design Sprint.

 

Process

Assuming the Sprint is being conducted over a five days period your week will look like this:

Monday: Map out the problem and pick a place to start. At this stage, the team will be tempted to start solving the problem(s), but this must be avoided.  It is essential that all parties come to the Sprint with an open mind.

Tuesday: Everyone will sketch solutions on paper and these ideas will “compete”. During this phase,  teammates work  independently to brainstorm. Knapp absolutely discourages the “group brainstorm” as it deters problem-solving, whereas “solo brainstorming” encourages answering big problems.

Wednesday: As a group, a decision will be made on how to solve the problem. This will come from the sketches that were illustrated the day before. During this phase, the group must be discouraged from thinking of new ideas. However, ideas from the sketches may be combined and unused ideas may be recycled for a later date or project.

Thursday: Create the prototype. For this step in the process the team should all be given jobs to create an effective prototype. The prototype does not have to be over designed but should be convincing to the User being tested on Friday.    

Friday: User Testing. Knapp suggests interviewing users while they use the product. The rest of the team should watch on in another room and take notes. These notes should then be categorized at the end to see what trends emerge. Changes should be made based on user feedback.

 

Why Use the Design Sprint?

Much like the Cognitive Walkthrough and Heuristic Method, the Design Sprint could be considered a “discount method”.  A sprint does not require much financial support, and can be done rather quickly. However, acquiring solutions to big problems does require staff to allocate a large amount of their work time to the process. This may place other important projects on the back burner. Thus like many user testing and evaluation methods there are pros and cons to the Design Sprint. Employing the Sprint would have to be at the discretion of the organization based on how many other important projects are currently being worked on.

Design Critique: Apple Watch Series 2

This is an in depth critique of the Apple Watch Series 2. Before owning my Apple Watch people (acquaintances or random people in everyday life) would often comment on my engagement ring. People would see my ring and ask a spectrum of questions ranging from the personal, “How old are you?!” to the superficial “How long have you been married?”, based on this one piece of jewelry.  After purchasing my Apple Watch five months ago, people have started looking past my fingers to ask about the object on my wrist. I usually tell people how much I love my device, answer their questions and advise them to purchase one themselves. However, after reading The Design of Everyday Things by Don Norman, and using his design principles to jot down notes for this post, I may have a different outlook now.   

When looking at the Apple Watch it is important to note that there are four affordances for communicating with the watch.

  1. Touching – the face of the watch has a screen and affords touching.
  2. Side Button – the long flat button on the side of the watch, affords pushing
  3. Digital Crown – round button that based on cultural aspect of watch design signifies rotation. This crown can also be pushed unlike a conventional analog watch, in which the button is pulled.
  4. Speaking – the watch will respond to voice when in certain situations (apps and Siri).

Discoverability begins when I first lift my arm and turn the watch towards me. The watch senses this motion and instantly lights up. The time is now displayed on the touch screen providing feedback that the watch is on. To launch an app on the watch. I must first push the digital crown in and then select my app. To select an app I can either click on it using my finger, or centralize the app on the screen (using my finger) and rotate the digital crown to zoom into the App. I rarely use the zoom feature as it takes longer and the digital crown rotation is not intuitive, based on cultural constraints. Before owning my Apple Watch, I wore an analog watch. I utilized the crown on my analog watch twice a year on average, during daylight savings time. If I used the crown any other time of year, I would off set the time on my watch having negative effect on my every day life, usually being late for an appointment.

As a result, I view using the digital crown on the Apple Watch as something to be used infrequently. I do not classify this a bad design.  I think later generations will adapt to the digital crown especially if this would be their first watch, and then cultural constraints would not apply. If something were to change, voice command built into the app to state the time and omit the need for a digital crown. There could also be a plus and minus sign on the touch screen display, and pressing these symbols would increase and decrease the time.

If the digital crown were not omitted from the design of the watch, I would change the placement of the digital crown. The digital crown and the side button are adjacent to one another. They both afford pushing but perform different functions. The side button when pushed brings the user to a dock of frequently used apps, and the digital crown brings the user to all the apps. Often times I mistakenly “slip” and push the side button when I mean to push the digital crown. It is definitely a nice design to have both buttons on one side, but does not lend itself to the functionality. I would move the side button to the opposite side of the watch as conventionally, one can find the crown on the right side of most watches (smart or not). 

Lastly, mapping on the watch is consistent. When I swipe my finger to the left the apps follow, same with the right. When I scroll my finger up in an app to expose the rest of the page the page moves upward. This is also consistent across multiple apps, reducing the use for knowledge in the head.  When setting the time in the timer app, something I do when I am cooking I must rotate the digital crown up to increase time. When using the Nike Running Club app, and I would like to set a time for my run, I would also move rotate the digital crown upwards.  

Overall, beyond the flaws, I still think the Apple Watch is an amazing piece of technology. Although the device tells the time, its scope far surpasses this one function, and thus may be branded incorrectly. I would be curious to know how the device would look if designers were not limited by the connotation of a conventional watch.  It is hard to say if the watch elements give the design cohesion or hinder its capabilities. I am sure there will more Apple Watch generations to come that will answer these observations.