Showing posts with label WordPress. Show all posts
Showing posts with label WordPress. Show all posts
Evaluation
Now that we have finished my project I thought I'd have a reflection on what I've done so far. In terms of time scale I felt like there was slightly too much time left for this project for my personal taste but I was able to expand what I was doing to fit this so it wasn't much of an issue. In previous projects I have been unsure about my designs and hoped for the best but this time I was able to validate and alter my designs through lots of user testing. As a result I am far more confident about designs and the changes I make to them, and will try to use more user testing in future projects.
Post Crit Changes
After reviewing the feedback I received I made several changes to my site:
The mailing list subscribing box was moved up to a more accessible place:
The Artists Lineup text size was increased to be more viewable on lower res screens:
More info was added to the homepage to show off which artists are announced, as they're the main reason people go to a festival:
Testing Outcomes
After lengthy testing and analysis I have finally finished my user testing. Below are the results and analysis presented on a user by user basis:
1.
Gender: Female Age:19 Previously Attended: N
Normal browser user journey.
Tasks: Find out if any of your favourite bands are playing this year, Purchase some merchandise that you like and Where is bestival?
What would you say the purpose of this site is?
To tell people about Bestival
Was the look of the site what you would expect from the Bestival Brand?
Yes
Did you feel slowed down at any point?
No, apart from not recognising the Instagram logo in the social media box.
Was anything in an unexpected location?
Everything was where it should be.
Screen Recording:
Heat Map:
Outcomes and Changes:
Heat map indicates a fairly us of the site concentrating on the nav and 3 main columns of the site. The user has never used Instagram before and didn't recognise the logo, to rectify this I added a label that drops down when you mouse over the icons.
2.
Gender: Male Age:26 Previously Attended: Y
Mobile Browser Journey using 3G/4G on Android
Tasks: Register an Account, What is Bestival like?
What would you say the purpose of this site is?
To promote bestival.
Was the look of the site what you would expect from the Bestival Brand?
Yes
Did you feel slowed down at any point?
The email verification was annoying and the gallery took too long to load.
Was anything in an unexpected location?
No
Screen Recording:
Outcomes and Changes:
The user seemed happy with the overall performance of the site but felt slowed down by the email verification process. Unfortunately this is an essential part of creating an account as it prevents fake accounts and unwanted spam. The slow gallery loading speed was another issue that popped up, after reviewing my gallery size it seemed slightly excessive so I got rid of the images that share the same theme to give a more concise view of what happens at the festival.
3.
Gender: Female Age:21 Previously Attended: N
Normal Browser Journey
Tasks: Email Bestival, What does Bestivals YouTube page look like?, Tell me about Major Lazer, Where is Bestival this year?
What would you say the purpose of this site is?
Official Bestival
Was the look of the site what you would expect from the Bestival Brand?
Yes
Did you feel slowed down at any point?
No
Was anything in an unexpected location?
Not getting an email conformation screen was strange.
Screen Recording:
Heat Map:
No real changes or problems apart from the email conformation not being present (this has now been added). The heat map shows a much more diffuse pattern due to the software running on windows. The choice of the user to use a scroll bar rather than the mouse has created a massive trace in the corner which can safely be disregarded.
4.
Gender: Male Age:23 Previously Attended: N
Normal Browser Journey
Tasks: What's Happening with Bestival at the moment?, Buy 2 Tickets, Subscribe to email updates.
What would you say the purpose of this site is?
To give people information about Bestival
Was the look of the site what you would expect from the Bestival Brand?
Yes
Did you feel slowed down at any point?
No
Was anything in an unexpected location?
Lack of email conformation was confusing.
Screen Recording:
Heat Map:
Outcomes and Changes:
This user had the same problem with lack of confirmation with a different feature which has now been added. The head map shows a similar pattern to the others with most mouse activity concentrating on the areas where information has been presented.
Gender: Female Age:22 Previously Attended: N
Mobile Browser journey using 3G/4G on iPhone.
Tasks:Where is Bestival?, Are any of your favourite bands playing? Where is Bestival?
What would you say the purpose of this site is?
Promotion for Bestival
Was the look of the site what you would expect from the Bestival Brand?
Yes
Did you feel slowed down at any point?
Menu system
Was anything in an unexpected location?
Clicked on Info to find maps before the actual map page.
Outcomes and Changes:
Unfortunately I wasn't able to film in the cafe I was testing in but instead recorded the users thoughts and actions manually. The user felt confused by the way the drop down menu elements functioned in responsive mobile view. To rectify this I changed the menu to that when the drop down menu is active all drop down sub-menus are opened to display their content.
Overall Thoughts:
I'm very pleased with the feedback I received and that all users felt comfortable with the look and feel of the site as a whole. It displayed correctly and all functions worked on the 2 most popular operating systems for mobile and desktop as well as 3 of the most popular browsers.
Testing Questionnaire and Tasks
To keep my user testing results consistent I decided to a make a template for each user, below is a sample:
Gender: Female Age:19 Previously Attended: N
Normal browser user journey.
Tasks: Find out if any of your favourite bands are playing this year, Purchase some merchandise that you like and Where is bestival?
What would you say the purpose of this site is?
To tell people about Bestival
Was the look of the site what you would expect from the Bestival Brand?
Yes
Did you feel slowed down at any point?
No, apart from not recognising the Instagram logo in the social media box.
Was anything in an unexpected location?
Everything was where it should be.
Gender: Female Age:19 Previously Attended: N
Normal browser user journey.
Tasks: Find out if any of your favourite bands are playing this year, Purchase some merchandise that you like and Where is bestival?
What would you say the purpose of this site is?
To tell people about Bestival
Was the look of the site what you would expect from the Bestival Brand?
Yes
Did you feel slowed down at any point?
No, apart from not recognising the Instagram logo in the social media box.
Was anything in an unexpected location?
Everything was where it should be.
Crit Feedback
After presenting my site a crit I received the following feedback from my assigned note taker, Jess:
The only major disappointment for me was the fact that I only received feedback from my tutor and the WordPress developer who came in for the crit, because of the time constraints. The reason I feel like this devalued the crit significantly is because my whole class is firmly within my target demographic so any input from them would have been very valuable to me.
"white band at the top - but you justifiedDue to the very rushed nature of the crit I wasn't actually able to demonstrate about a third of my site but I'm fairly pleased with the feedback I did receive on my site. It was mostly just slight stylistic and organisational changes and I plan to act on all feedback that hasn't been marked as justified.
change the background colour of the other things- not worth it
move the mailing list
more- things- change name- put mailing list in pink band
change search text
hard to tell about the 4 boxes in the middle-
artists names- been separated by pink stuff-
more artists on the homepage
colour band change- justified
buzzing with activity - you dog
family festival - is separate = not your target audience
refine the information- too much stuff-
remove sidebars on shop/"
The only major disappointment for me was the fact that I only received feedback from my tutor and the WordPress developer who came in for the crit, because of the time constraints. The reason I feel like this devalued the crit significantly is because my whole class is firmly within my target demographic so any input from them would have been very valuable to me.
How Testing Went
Overall I'm very pleased with how testing went. I managed to mostly stay within my age and class demographics but slightly strayed in favour of women in terms of gender balance but I don't think that will pose a problem. In total I tested in 3 locations; my flat where I tested on my neighbours upstairs, a pub near my house and and a coffee shop a little further afield where I tested complete strangers and staff members. In order to keep results as true and neutral as possible at no point were any of the respondents told that the website was mine, they were simply told it was an exercise in usability testing. Shown below is on of my respondents testing my site with an audio recorder to collect interview results for typing up later.
Typical User Journeys
As part of my user testing I plan to monitor user journeys so I can keep track of any dead ends or backtracks a user makes, which show that they've been slowed down. To better understand how user journeys affect the way in which your site is perceived I read some helpful articles, the most helpful being from SciVisum and The UX Review. The 2 main aims for user journeys are to understand how a user currently uses a site and how a user could use the site. During my user testing I will assign a user a task such as 'book a ferry ride' or 'buy something you like', give an expected user journey in an ideal world and the actual journey they took. Once testing is completed I will compare the 2 and try to use that to optimise my site.
Identifying Bestival Demographic
Before I begin my user testing I decided to identify the core Bestival user demographic so I can concentrate my testing there. To do this I went through all the promotional material, the PR Company behind Bestival (GetInvolved) and sorted through event photos. After this research I concluded that it was late teens to early 20s with a gender ratio of 3male:2female and from the NRS social grades ABC1 and C2. Over the course of my user testing I will try to keep my demographic as similar the this as possible.
Usability Software
As there is no budget for user testing my site I have had to resort to 'guerilla' tactics to create a system made up of multiple software elements which monitors how users use my site.
IOGraphica:
The first part of this system is a piece of software called IOGraphica. Originally created by a programmer out of boredom, is tracks a users mouse patterns and monitors mouse pauses. Through using several filters I was able to create a 'heat map' of where a users mouse moves. Below is a rough demonstration of how this looks:
ScreenFlow:
The next part of system is a simple screen recording program called ScreenFlow. It records the current view of the screen which will prove a valuable tool to reference certain problems the user might face.
Mouse Locator:
The final piece of my user monitoring system is a Pref Pane based application that highlights the position of the mouse and shows clicks. This is simply for better visibility.
IOGraphica:
The first part of this system is a piece of software called IOGraphica. Originally created by a programmer out of boredom, is tracks a users mouse patterns and monitors mouse pauses. Through using several filters I was able to create a 'heat map' of where a users mouse moves. Below is a rough demonstration of how this looks:
ScreenFlow:
The next part of system is a simple screen recording program called ScreenFlow. It records the current view of the screen which will prove a valuable tool to reference certain problems the user might face.
Mouse Locator:
The final piece of my user monitoring system is a Pref Pane based application that highlights the position of the mouse and shows clicks. This is simply for better visibility.
Planning Usablility Testing
As the date for the crit has been pushed back by a week I have decided to use this opportunity to give my site some guerilla user testing. To do this I have decided on an approach using a mixture of software to track user journeys as well as basic questions about the overall look and feel of the site. In order too not lead the user in any way I will have to give them vague prompts to direct them but maintain the element of them figuring out where things are. A very helpful resource that has helped inform my decisions so far is Usablility Geek, in particular their Introduction To Website Usability Testing.
Login and Member Profiles
To ensure I fulfil the brief criteria I had to create a way for users of the site to log in and create/customise and account. After a little bit of research I settled on BuddyPress, which is the standard for creating a social community for your site. After a quick initial setup I created a menu item for 'My Bestival' which gives users the ability to log in or register, which changes to my profile and log out once you are logged in on your account.
I have also enabled a basic range of user actions which ensure enough usability without overcomplicating things. Users also have the ability to edit their public profile and add a profile picture.
I have also enabled a basic range of user actions which ensure enough usability without overcomplicating things. Users also have the ability to edit their public profile and add a profile picture.
Lineup and Artist Pages
To provide the user with more detailed information about artists performing at the festival I created a separate page that shows the whole line-up over the weekend as well as detailed information about each artist. For every artist page I included a photo, short bio and a music video.
Adding a Map
In the info drop down menu I've included a link to view a map for finding Bestival. To do this I used an 'Official' maps plugin. The features I really like about it were the ability to set a specified map view and zoom level, change marker style and include detailed info about each waypoint.
Calenders and Bestival Schedule
As part of my site I needed to include a calendar functionality to display a schedule for users to keep track of what's happening before and during the festival. After using a few plugins I settled on using Spider Calendar. The main reason for using this is that you can create a single calendar, populate it with events and have a shortcode calendar on a page and a sidebar widget that are synchronised.
Homepage Redesign
After a sit down with my tutor, it was suggested that I rethink how my homepage is structured and what information is displayed. the main issues were large amounts of text for a home page, font readability and missing info. This is what the original page looks like:
After having a bit of a think on these issues I think I agree on all points for improvement and set about improving my page. The issue with font readability was a fairly simple task, I just reset the plugin to the original default font and after a quick poll of people in my class everyone agreed that it looked much better. I think the reason for this problem was that I made a very snap choice of fonts and chose one that was far more suited to headers than body text. The default font of 'Open Sans' works very well as both body text and header text with its variety of weights.
The information that was in display on my homepage was much better suited to be on a separate info page so I copied it all across onto a new page a made a new part of my navigation that linked to it.
In order to address the problem of what information was displayed I had a look at and article/infographic I was given that asks as a guideline for the kind of things that should be included in a standard homepage.
After going through this list a few times I have managed to incorporate most of the relevant items into my new homepage. Some things like customer proof have been relegated to other pages because they are less important when it comes to this kind of product, for me the customer proof comes from thing like photos/videos of people enjoying themselves of the site. The biggest feature change is the CTA banner allowing people to buy tickets (one of the main reasons people come to a festival site) and the movie of last years festival to show people what to the atmosphere of the festival is like. Below is what my new home page looks like:
After having a bit of a think on these issues I think I agree on all points for improvement and set about improving my page. The issue with font readability was a fairly simple task, I just reset the plugin to the original default font and after a quick poll of people in my class everyone agreed that it looked much better. I think the reason for this problem was that I made a very snap choice of fonts and chose one that was far more suited to headers than body text. The default font of 'Open Sans' works very well as both body text and header text with its variety of weights.
The information that was in display on my homepage was much better suited to be on a separate info page so I copied it all across onto a new page a made a new part of my navigation that linked to it.
In order to address the problem of what information was displayed I had a look at and article/infographic I was given that asks as a guideline for the kind of things that should be included in a standard homepage.
After going through this list a few times I have managed to incorporate most of the relevant items into my new homepage. Some things like customer proof have been relegated to other pages because they are less important when it comes to this kind of product, for me the customer proof comes from thing like photos/videos of people enjoying themselves of the site. The biggest feature change is the CTA banner allowing people to buy tickets (one of the main reasons people come to a festival site) and the movie of last years festival to show people what to the atmosphere of the festival is like. Below is what my new home page looks like:
News Page
To create a page where all the news contact could be accessed in one place via the main navigation was thankfully a very simple task with Wordpress. To do this I needed to go into the Customize tab of the Dashboard and enable the page I called 'News' as the page where all the latest posts are gathered and theme pretty much does the rest.
I'm pretty pleased with how its all looking with the stories populating the framework of the theme, especially the way that the most recent story is placed more prominently. In order to fully finish it off I plan to add 3 more stories to publish towards the end of the project. 2 very helpful features that came bundled with the theme that I have enabled are the Sharing bar and Previous/Next stories navigation widget. The sharing bar isn't to obtrusive but instantly noticeable and with help with promoting the festival on outside social media with powerful earned media. The navigation widget should also provide an extra means of navigation in a linear way through all or some of the posts on the site.
I'm pretty pleased with how its all looking with the stories populating the framework of the theme, especially the way that the most recent story is placed more prominently. In order to fully finish it off I plan to add 3 more stories to publish towards the end of the project. 2 very helpful features that came bundled with the theme that I have enabled are the Sharing bar and Previous/Next stories navigation widget. The sharing bar isn't to obtrusive but instantly noticeable and with help with promoting the festival on outside social media with powerful earned media. The navigation widget should also provide an extra means of navigation in a linear way through all or some of the posts on the site.
Favicon
Something I've noticed about my site that can be very easily improved is its lack of favicon in the tabs view. I had a look at the previous Bestival site and they just used the B from their previous logo and cropped it out, so I decided to do the same but with the updated logo.
I think the addition of a favicon is a simple thing that can help round out the overall design of the site and make it look much slicker.
I think the addition of a favicon is a simple thing that can help round out the overall design of the site and make it look much slicker.
Time Management
With one week to go until Crit I decided to take stock of my progress so far and make sure I'm not leaving everything until the last minute. My 2 things to check against will be the brief requirements and the population of my information hierarchy.
In terms of info population I'm more than halfway, and almost all of the outstanding parts are already available online or in my archive. At this point I'm not worried at all about finishing information population.
A home page with some information about the client.
An about page with detailed information.
A booking system
Detailed information about each event.
A news area
Contact infoand a map.
An events calendar with categories.
A shop selling some merchandise using PayPal
A search bar.
A gallery page.
Ability to register and log-in.
A blog.
Links to social media, including some live social media feed.
An analytics system.
My features list is also nearing completion but I think I've left most of the hard things to implement towards the end of this project. I think I'm going to have to tackle the calender, log in function and the booking system over the next few days to ensure that I can present a 'complete' site for the crit.
In terms of info population I'm more than halfway, and almost all of the outstanding parts are already available online or in my archive. At this point I'm not worried at all about finishing information population.
An about page with detailed information.
A booking system
Detailed information about each event.
Contact info
An events calendar with categories.
A search bar.
A gallery page.
Ability to register and log-in.
A blog.
An analytics system.
My features list is also nearing completion but I think I've left most of the hard things to implement towards the end of this project. I think I'm going to have to tackle the calender, log in function and the booking system over the next few days to ensure that I can present a 'complete' site for the crit.
Shop
As part of the brief we had to include a working merchandise shop to that is linked to PayPal. At first I looked through the built in catalogue of plug ins and found a very popular one called WordPress Simple Paypal Shopping Cart.
It seemed to do what I wanted in a very simple way but the implementation seemed to be very basic with almost no support for anything other than a basic cart and PayPal support. It just used a generated shortcode snippet that is pasted into the chosen shop page and the adds and add to cart button below. This simplicity would be good for embedding single items into an article or artist page but for a dedicated shop it didn't work too well.
It seemed to do what I wanted in a very simple way but the implementation seemed to be very basic with almost no support for anything other than a basic cart and PayPal support. It just used a generated shortcode snippet that is pasted into the chosen shop page and the adds and add to cart button below. This simplicity would be good for embedding single items into an article or artist page but for a dedicated shop it didn't work too well.
After my frustration working with this plug in I asked around the class and some people had used a plug in called WooCommerce that came bundled with a premium theme they had bought. After doing some research I found out that just the WooCommerce plug in is free to download in a .zip file and then upload to Wordpress.
WooCommerce is a massive step up from what I was using before and helps set up a fully functioning shop that could be used to build an entire business off, with distribution management included. Although I wont use many of the features is does everything from tax calculations, stock management, automated sale periods and many analytics tools.
Analytics
In order to track page views and other stats on my site I used yet another part of the fantastic Jetpack suite of plug-ins, The Analytics extension. This has a small section in the top bar of the admin tools to give you a brief overview of the last 48 hours as well as a dedicated section in the dashboard for a much detailed breakdown.
This can be useful to see how people navigate the site and if they use certain pages more than others, which can help with optimisation. Monitoring traffic can also help with actual event planning in many ways, such as comparing page views on the ticket sales page against actual ticket sales to determine the percentage of people who follow through and buy tickets. This can be one indicator of whether ticket prices are what people are expecting.
This can be useful to see how people navigate the site and if they use certain pages more than others, which can help with optimisation. Monitoring traffic can also help with actual event planning in many ways, such as comparing page views on the ticket sales page against actual ticket sales to determine the percentage of people who follow through and buy tickets. This can be one indicator of whether ticket prices are what people are expecting.
Subscribe to:
Posts (Atom)









.png)
.jpg)






























