Tests

rAlbum Paper Prototype Test

This week I started my user testing to see how my users react to the flow and layout of my application. I conducted this test with all of the knowledge I learned from the first round of paper prototyping.

For starts I made my wireframes very clear and defined as possible. I knew this was going to be extremely important for this round because my tester was going to be a senior citizen and I wanted everything to be clear and readable for them.

Next I made sure that the prototype was accurate to size. I was carful to create the prototype to be the actual size of the iPad. I even used my family’s iPad to compare the size, so I could ensure I was accurate with that.

I also did a little more research just to see if I could find any more examples of a paper prototype test. The video  I found was very nice. It had a couple of great tips, especially because they also used a tablet for their prototype. One of the things that they did that I really liked was using a piece of cardboard to make the paper tablet a little more weighted and more real. He also suggested using separate pieces of paper for the scenes, which I did in my last paper prototype test. I completely agree with this. Although it makes things a little confusing because there are so many of them, I feel like it makes more sense to the user. He also printed out each of the ui elements that he thought he may need. I also found that this was helpful in my testing. He also used tabs with his elements, which is something I may try in the future.

Overall I found this to be a very informative video. I highly recommend it for those who are paper prototyping for the first time.

I also took a look back at my first paper prototype tests, and critiqued them. I noticed a lot of improvement with my second video from the first one.

When testing I tried to encourage my user to express how she felt about the tasks so I could get a feeling of if I should make changes to my flow or layout.

Some of the things that I asked my user to complete took her a little while, however most of that was because it was the first time she had used the application. When certain tasks were repeated later on in the test, the user remembered exactly what to do to complete the task.

Her feedback was very positive. She felt it was very simple to use and felt she would have no problems using it in the future.

Although she had no negative feedback, I took note of the features she struggled with, for instance the ‘other’ button and have to consider if I want to change the layout of this feature.

Overall the font size seamed to work great. The only one I may want to make larger is the ‘comments’ because I noticed her getting closer to the prototype when reading the, Overall I was very pleased with my test. She was able to figure out all of the features and I was able to understand how she would use the application.

Here is the paper prototype video (click to play):

Paper Prototype

More User Research and Personas

For this week I went back to find some more user research. Although the information that I found last week was a good start, I knew that I really needed to talk to some users before going ahead with this idea.

To do this I contacted three senior citizens and interviewed them, and contacted three people from the baby boomer generation and interviewed them with a few additional questions about the future.

I was able to find a lot of really great information with this set of interview questions. I made a few charts of data and further analyzed the information that I found in the report below:

Click Here to view it!

This was a much more helpful set of information because I heard it from the users themselves, and was able to find out the specific information that I wanted to hear.

I also had the chance to hear their reactions to my concept for the application itself. This would have been extremely difficult to find strictly searching online.

With this information I was able to create my two personas. Since I had experience creating a persona from the last time I created them, I was able to dive right into after analyzing my user research.

Although the strategy for finding my user research was much different this time then the first time, I feel they were both very useful. It is always useful to watch a user use a product and talk about it. However, the interviewing that I did in this week gave me a lot of great information to start of my application with.

The last time I went through the design process of the application I reflected back to my personas and user research several times, so I know how important these steps are to the future of this project.

Here are the two personas that I created for my new application:

personaHoward
personaLois

 

 

Paper Prototype Testing Round Two

This week I went back to the paper prototyping stage and perfected it. There were many things that I learned from the first attempt of prototyping that I wished to change.

The first was the actual paper prototype itself. Although the paper prototype is meant to me a wireframe so you can catch mistakes in the early stages, my first prototypes were just too much of a wireframe.

It interfered with the results of my testing because I could not tell if my user was confused because of the functionality of the application or because they could not understand what the wireframes represented.

The other visual problem with my first test was the size of the prototype. I had made the pieces really small, which was a problem because the user was not accurately test the flow and placement of the application.

I also changed the style of my testing so that I could get an understanding of what the user expects on each page. I still asked the participant to perform certain tasks, that way, I could guide them in a way to explore the entire application.

After the modifications made to my paper prototype and my testing style, I was able to find out which parts of my application are working and what I may need to look into changing.

I remember back when I conducted my first usability test for this project I watched a video about paper prototype usability testing. The video was extremely helpful at the time, so I went back and watched it again to familiarize myself with how they conducted the test. The video is called, Example Usability Test with a Paper Prototype. I really like how this test was conducted. I strongly recommend watching it for anyone unfamiliar to paper prototype testing. It explains the important parts of how to test while simultaneously demonstrating it.

Another video that was very well done was a video called iPhone app | paper prototyping although this video was more of a demonstration of the application rather than a test, I felt it was a great example of what to visually look for. It had a neat layout and accurate sizing.

Here are just a few more images I found as inspiration in the recreations of my paper prototype:

Paper Prototype

Paper Prototype

Paper Prototype

After completing more research I was inspired to complete next paper prototype test. Overall I am very happy with the results of my test.

You can view my video below:

Test

This week I also did more visual research as I continued to work on my user interfaces for the screens. It is going to follow the flat metro style. The main menu is going to resemble Windows eight block look.

Windows 8

Windows 8

I began researching different possibilities that I may want to use for the screen prototype. One of these is invisionapp, this looks like a nice option that is free to get started. Before making my final decision I will have to compare it to the other options.

Another is proto.io this one also looks like a nice option. It had a lot of possibilities with this app such as animation, interaction and more. This is one that I will diffidently look more into as I get closer to making my screen prototype.

Another great option is Marvel, which says, “Turn sketches, wireframes, PSDs and designs into interactive mobile and web prototypes in just a few clicks.” This sounds very easy to use and will most likely be perfect for what I am trying to accomplish. This is also another free service.

Fluid is another option, however it only allows 10 screens to be used. Although my application is not that large, I would rather choose something with more flexibility. I want to really show the capabilities of my application and I don’t want the limit on screens to ruin that.

The last option that I looked at this week was called justinmind. This looks like it has a lot of options and capabilities. I will definitely consider this as a strong contender. However this may be even more than I want for this particular project.

Next week when I create my screen prototype I will reevaluate all of my options and start my creation.

I made some changes again after my video of my paper prototype test. I made some changes to my prototype so the participant could understand more about how the app is going to work. I also made some changes to my video so it looked more professional.

The new paper prototype test video is below:

Screen Shot 2014-03-14 at 11.36.02 PM

 

Paper Prototyping

This was the first time I had ever attempted to test with a paper prototype. I had only heard of this once before when I was first researching usability testing. If done right, this seems like an easy and cost efficient way to get a lot of testing done in the early stages of development.

Since this is the first time I was conduction a paper prototype I found that it was crucial to get as much research as possible. The first site that I looked at, explained the importance of prototyping.

It supported a lot of the benefits that I had assumed would come from paper prototyping. One of the things it said was, “Yes, it’s nice to start building a website or multimedia project and just see where it goes, but starting with rapid prototyping can help weed out bad ideas or help improve good ideas that are hampered by poor implementation.” As I had thought, paper prototyping is a great way to find out what works and what doesn’t work in a design, in the early stages of development. Learning this information early on will help save time later on in the design process.

I know that I took some great information out of my tests. I now know what works and what doesn’t. When I move on and further develop my design I can choose how I would like to change it.

The site also bulleted the important steps to paper prototype testing, this is what it said:

▪   Find users —These should not be other people working on the project. People with as little knowledge as possible about your design and work will provide the best feedback.

▪   Assign a person to be the computer — If you built the design entirely yourself, you’re the computer that the person interacts with. You’ll want to grab a friend to record the testing sessions so you can watch them later. If you have a team, assign one person to make your prototype respond to user inputs.

▪   Record the test — Recording a test is recommended. This doesn’t replace observing the test, as you’ll see below, but there are several reasons to record a usability test. You can refer back to it later, you can show people who didn’t observe the test how it went. If you’re trying to convince someone that a design needs to be changed, showing them a video of users struggling with a design is a great place to start.

▪   Conduct the test — Explain what users are supposed to do. Give clear tasks and scenarios. Let’s say we were testing Amazon.com. Here is a scenario you could give a user: “You are a big fantasy book fan. You just heard a new illustrated edition of The Hobbit came out in October 2013. Find the book, put it in your shopping cart and buy it.”

▪   Think aloud — Have users think aloud while going through your test by speaking what they are doing and thinking. Are they confused? Why are they clicking on this? What do they expect to happen when they do that? This will help you understand what they are thinking while they use your prototype. It will also help you formulate questions to ask them when they are done.

▪   Observe — Even though you are asking users to think aloud, they may not say everything you need to know. Users may be struggling with a site but still tell you they think it is relatively easy to use. This can be because users want to appease you or because they don’t want to appear to not be able to work a website. Regardless, observe what is happening. You’ll learn a lot by seeing how well users can complete various tasks with your prototype. Remember, you’re testing your design, not the user. I always make this clear to users.

▪   Debrief — Ask users what they thought of the prototype, what they thought went well, what they thought didn’t go well, how they felt using your prototype, etc. If you noticed a user struggling with part of the prototype, specifically ask them about that.

▪   Create a list of issues to fix — Based on the feedback that you got from users and what you observed while watching users, create a list of issues to fix. If there are a lot of issues, you may want to modify or create a new paper prototype. If it went fairly smoothly, it’s time to create a higher-fidelity prototype and get additional user feedback later.

I made sure to reference these steps when I was developing my prototypes and my test.

The site also referenced a video that demonstrated a paper prototype test. This test was not for a phone application however it really showed the process of the test. They even gave the users paper credit cards to use. This showed me that my paper prototype had to be as close to the experience the participant would get actually using my application as possible.

The next site I saw said that wireframes do not work as paper prototypes. This confused me because it contradicted with a lot of the other things that I saw that said that this stage was made for wireframes. Although I could see the benefit of avoiding wireframes I still used them in my testing. I regretted this decision because I think it was a little difficult for my testers to use. However, I feel like I learned from the experience and will not make that mistake in the future.

The next site that I saw expressed the two major uses of paper prototypes. It said that they were:

  • To communicate ideas: between designers, developers, users and other stakeholders in the first stages of the user-centered design process.
  • As a usability testing technique: to observe the human interaction with user interfaces even before these interfaces are designed and developed.

These ideas just further supported the importance the paper prototyping has. Usability testing is crucial to a well-developed design, and paper prototyping allows this.

I then watched a few videos to get a better visual idea of how the tests are conducted, and to gather more information about paper prototyping. The first video I watched, explained the importance of paper prototyping. As designers we come up with several different design ideas, Paper prototyping is a cheep way for us to test those ideas and see what works and what doesn’t. I am using it as a way to see how the user reacts to my design. That way I could fix any confusions before it is too late.

The next video was a demonstration of how paper prototypes work. I found this very useful because I could see the method they did to cerate the changing screens.

I referenced this when creating my prototype.

The next video was another really useful video explaining how to create a paper prototype and conduct a test. I really liked how they used tape in their paper prototype tests. I was inspired by this and conducted my tests using this method.

The last video I watched showed how beneficial it is to use prototype testing. She shows the several drafts she has made just staying in this stage of testing. These changes show that she is receiving crucial feedback at a stage that is very easy to fix.

She was also very organized in her testing, and I made sure to also be this way by keeping my screens in their sections.

Here a few photos that I found as insertion for my paper prototypes:

 

 

1

 

 

2

 

3

 

4

 

In my redesign of my paper prototype I will make sure to take features from this design. They are all very clearly laid out and easy for the user to understand. This is something crucial that I include in my redesign. Also they are the size of the actual phone. I will make sure to reference these images. It is really important that the tests accurately portray the use of the application and size and clarity have a big affect on that.

The Importance of Testing

Before jumping into my usability tests I research a little more about how they are done and the importance of them. I know from my experience interning on the user experience team, that usability testing is a crucial part of the design process. This step gives the designer feed back on what is good and bad about their design. With this information the designer can come up with different solutions and design ideas, to develop and overall better design.

According to one of the articles that I read, Self-Education in UX and Working with User Research Data it is very important to observe the popular applications of the time. Daniel suggests, “Look for UX trends. What trends interest you today, and what will interest you tomorrow?” By thinking about these questions you will have a better sense of what direction to take you design in. For example, recently applications have been taking the flat, metro trend. I will most likely be taking my app in this direction. I also kept this in mind with my usability test to see if any of my testers would say that is something they would like to see.

In another article I read, Analysis, Plus Synthesis: Turning Data into Insights By Lindsay Ellerby, it is extremely important to ask questions. I noticed this a lot in my internship. A lot of times participants feel timid. It is very important to ask lots of questions to dig deep and find out what the tester is thinking. Also it is really important to encourage thinking out loud. This helps to understand what they expect everything to do, and to understand if your app is doing that for them.

The article also separated testing into five steps:

  1. Analysis + Synthesis
  2. Collect and organize the data: Make your data manageable.
  3. Mine the data: Identify what you see.
  4. Sort and cluster the data: Manipulate or reframe your data, as necessary.
  5. Identify insights: Discuss, articulate, incubate, and socialize your insights.

It is important to make sure to have a clean and clear way to express all of the data you collected and analyze this. I found that an excel spread sheet could be really usful for this.

On Wikipedia they emphasize the importance of connecting with the user. As a usability tester you have to empathize with the user. It says, “When investigating momentary user experiences, we can evaluate the level of positive affect, negative affect, joy, surprise, frustration, etc. “ It is really important to understand how your application makes them feel and why. It is then your job to analyze what can be done to change that feeling.

I also watched two videos to research a little more into usability testing. The first was titled  Usability testing and it was a basic overview of what usability testing is and the importance that it holds. According to the video it is important to anything with an interface. There was also a huge emphasis on evolving users in earlier stages of the project. Not just the end. This is really important because you should be making changes throughout your design and designing for the user. The best way to do this is getting feedback at several stages of testing. The video also stressed the importance of recruiting testers that would use the product ask questions and encourage thinking out loud. This means that you should not find testers that have no connection to the application. The tester should be someone that would actually use the product.

The second video I watched was titled Example Usability Test with a Paper Prototype. This was a very well made video that I strongly recommend to anybody who has never usability tested before. This video is an example of a usability test for a children’s website. This is really useful video because you can see what kinds of questions you should ask and how you should ask them. It really helps to understand why questioning and thinking out loud are so beneficial to the designer. This is a great way to guide you’re tests around. I made sure to act similarly to this test as well as those I observed in my internship.

All of this research gave me a strong understanding of how testing should be done. After getting all of my testing materials prepared, I felt very confident conduction my tests.