User Journeys: Completing tasks?

This post takes place in video format and gives live demos of how the content can be change, if reading in the document, please refer to the blog post which can be found here (https://akbrodie.wordpress.com/2017/05/24/user-journeys-completing-tasks/).

To begin with I will start with a video showing how simple it is add an image to the assets section of the cms.

The next part would be to edit/delete an image, In this video demo I will delete the image I just added.

Finally, and most importantly the websites’ articles are editable, and in the video demo below, it is shown how this is done.

Advertisements

User Testing

I gave the cms to one of the users who regulary deal with the site and use it to change clients websites. This is what I recorded;

https://www.youtube.com/edit?o=U&video_id=uA-XSVKIo3s

Some invaluable peices of information came from this User testing. The main part is that it was a lot easier to use than what was being used previously. This is great as it shows that I have achieved my objective.

The user noticed that there was an issue adding a new page to the website through the cms. This some errors within the code in which I didn’t have time to remedy.

The backups page is also left uncompleted but has a reasonably basic structure, the user was confused as to the purpose of this page.

The main issues of this site the fact some of the pages lack information, so first time users will struggle to understand how to use the site, this could potenitally benefit the first time users.

Final Prototyping Testing

The prototype test is available here (https://youtu.be/xgJoQ81DkD0).

I was able to test the prototype on someone from my target audience of 8-12. The user who was able to test my site was aged 9 and gave me some really invaluable feedback.

  • There are lots of elements throughout the experience where the user would expect to see some form of interaction. Either hovering or clicking on frogs should induce some form of action. Whether it be pointless or not, the point of the action is to create a sense of interaction with the site. This was explained to me by the young girl testing my site, but also apparent as she was exploring on the site.
  • The introduction is too long with too much text, to begin with the user went very slowly reading the different lines of the text but by the third page started skipping the most important parts of the information. This section needs to made shorter.
  • Also as the introduction I have added a ‘tutor’ frog who explains things but prior to this section, the user has only just selected their frog and colour and are confused to see another frog. This should be removed and instead replaced with the frog they have just chosen.
  • It isn’t obvious in some areas of the experience when things are clickable and are often missed by the user. An example of this is in the Departure Lounge where none of the items such as the passport where clicked on, nor were the profile areas. Guidance of a little text would be useful here.
  • Some of the call to action buttons are a little distracting, this refers to the Social page where the user expected the Chat button to actually start the conversation with the other user. It is also on this page that it isn’t apparent that you can press to interact with other users. Also the users was somewhat confused by the word ‘Social’ and suggested it should be renamed to ‘Park’.
  • It would be better to name the frog and have that as the username rather than your own name.

After testing and providing this feedback I spoke a little bit regarding her overall thoughts about the website.

  • Her idea: It’s a really cool idea and I should make it so that she can play it. Then I should go to her school and suggest to her teacher the website so she could play it in class.
  • Her favourite section was the language lessons, but the quizzes would be cool too. I should add a section for a little bit of maths somewhere.
  • When selling accessories, I should also sell action toys of the different frogs and accessories so they can be customised in real life and played with. The background art could be sold too. For example a Paris pack, by her recommendation should include 2 frogs, french accessories, and the scene backdrop.
  • I should sell ‘squishy toys’ the ones that are usually filled with liquid so when you squeeze them, a bubble appears.

Personal notes from the user testing;

There was this really sweet moment when she was like “I still have £23 from my birthday, I could get a few colouring books if you already made them”. This shows that the site definitely has an appeal to my target audience.

When testing the site, the young girl would often stop looking at the site and continue colouring and drawing. This didn’t just show her ability to multitask, but also the opportunity to capitalise. Activity books could be sold for each virtual trip so they could colour, draw, answer questions, and play puzzles with relevance to the content on the screen.

Testing & Correcting the code

Testing the site for improvements can be done really easily, sites like nibbler offer services for free to check your website and give it an overall rating based on modern website requirements.

When testing the exhibition website, it gave some really interesting feedback. Below are the results of the test, they mean that the site is lacking in quite a few areas. It is great to know that I succeeded in 5/9 areas in which I was tested

MY OVERALL RATING

1.png

NEGATIVES

2-12-32-22-4

POSTIVES

3-13-23-33-43-5

I went back and tried to correct my errors, this is the results of the test after I had fixed the problems to the best of my ability.

I improved the meta tags

Schermata 2016-01-17 alle 19.25.38.png

I reduced the amount of errors;

Schermata 2016-01-17 alle 19.26.57.png

giving me a new overall rating;

Schermata 2016-01-17 alle 19.27.56.png

References;

http://nibbler.silktide.com/en_US/reports/www.scottlewis.eu

Mobile Testing

An important side of the marketability of this website is the amount of users that can access it. This means, that the website must be accessible by multiple devices. Therefore I have tested three of the screens on the website to check if they would work, below are the results.

It is worth noticing that the site looks good and works well on most of the screens but it is important to also note that some of the design stops working on the smaller screens and that the devices are unable to show the site as they have been designed. The best way to get round this is to build a separate design for landscape mobile. Another issue is the fonts, and whether they display correctly, as you can see there is a mixed result from across the different devices. The mobile optimization has worked to a satisfactory level, but has suffered a few issues on smaller screens.