User Testing

This week in Capstone, we were supossed to do user testing for our project. For me, this meant getting people to use the prototype that I have made of my website (for what I have done so far) and give me their opinions and insight. I asked questions about the design, about how they interacted with it, and also how they felt about the overall experience. I interviewed 3 people and got pretty similar information from all of them, but some good suggestions and compliments as well!

Users

All three of these user types are people who I imagine would actually come across and perhaps use this website. Perhaps they have different purposes; however, they would all equally find useful information.

• My first user was my cousin. He is the ideal user of the website at 12 years old and he has also expressed concerns about anxiety in the past.
• My second user was my mother. She has searched for ways to improve the mental health of her children after they got diagnosed with different disorders when they were younger, which makes her fit the concerned guardian category of users.
• My third user was my sister, who is a young adult with mental health diagnoses, making her fit the general mental health user category for the website.

Specific Findings

When I started designing this website for Adolebrum, I assumed that a bright color scheme and a happy mood would be the most attractive for a suffering adolescent looking for information. When I showed this website to my cousin, he confirmed this when he said that he liked the smiley photo at the top of the page and that he liked the orange and blue colors (coincidentally, they are his favorite).

I found also that most people appreciated the use of horizontal bars to separate the content. I asked everybody if it was clear where one section of information stopped and another began and both my mother and sister stated that the use of the different colored bars made it very obvious. I am proud that this element worked so well.

However, I have been designing this site on a MAC, which is much larger than your average PC laptop. My participants using a smaller laptop noted that although the titles were legible, they did not stand out enough among the rest of the copy. Since then, my professor has confirmed this as well.

Another area that posed difficulties for people was that they preferred to have a mobile site rather than a desktop version. I am planning on creating both; however, when asked which one they would prefer, both my mother and sister reported that they would prefer to use a mobile site. My cousin, on the other hand, does not have a phone and only has access to desktop browsers so that was his preference.

Broad Insights

Though this process, I have discovered a couple broad insights that I can use to make my website better and also to make my user testing more effective as well.

• A mobile version is a must. Although people usually have access to a laptop or desktop, a mobile version is far more convenient for people
• If I don’t ask specific questions, I won’t get specific answers. If I simply ask “What do you like about it?”, useful information can still be gained; however, if I ask a more specific question like “what do you think the mood of this webite is?”. It is easier for them to answer and also easier for me to get the information that I am looking for.
• Visual hierarchy is of the upmost importance. Legibility is only half the battle, but if people don’t clearly understand what is the section header and what is the copy, there leaves room for misinterpretation.

Re-design

From these interviews and insights, I have several elements that I can change, add, or improve to make the website better.

• Add a mobile version of the site. It is becoming more and more obvious that I need to have a mobile version of the site for the most people to access this, so this should be a priority
• Improve the visual hierarchy so that it is more obvious what the header and the copy is. I will do this by bolding the header, changing the color, or even both.
• Change the way that I introduce my articles. On the home page, the bright orange square is a clickable link, but only on the home page. I have repeated this orange square all throughout the website though, so it is easy for users to get confused and think that it is clickable because the first instance of it was. I should change this by moving it or removing the drop shadow, probably both, to insinuate that they are separate elements.

If you want to see my first post about capstone, click here!

If you’d like to see my previous post, click here!