Using UX design to drive your conversion rate

| By John Wright
With Google privileging user satisfaction as its key ranking factor, John Wright of adventures.io provides some timely advice on what you can do now to upgrade the UX design of your website and improve performance
This time last year, for the 2016 LAC issue of iGB Affiliate magazine, I wrote an article titled 2016: the year of design. That showcased how important design is for any website and if we look at the top-ranking affiliate sites today, particularly those that were acquired last year, it’s clear the popular sites have strong designers. Even the biggest igaming companies all have their own design teams, which include user experience (UX) designers. My journey over the past five years has taken me on a long, winding road that started with SEO, then led me down the path of conversion rate optimisation (CRO), which in turn then led me to UX design. I haven’t given up on SEO, but I do think too many affiliates and operators put too much emphasis on it and end up making sites more for a search engine than they do for a user. To play devil’s advocate, you don’t need an attractive website for it to be effective. Part of the reason you may see dated sites do well despite looking ugly is because they have quality content, they format their site properly and sometimes that ugly look earns the trust of the user. They don’t feel like they are being sold to by professionals — to them it just feels organic, as in natural. Ideally, you’d have money to be able to invest in a quality UX designer, but you don’t need money to be successful or to have a well-designed website — there are principles you can apply yourself that will  make a difference until you’re in a position to outsource this to a specialist.
Prototyping tools have come out of nowhere and they make mapping out your wireframe, layout and testing faster than previously possible
Whether you’re looking to hire UX help or improve your design yourself, below are some of the most important things to take into consideration. Sketch versus Photoshop For those who use Sketch, I don’t need to say anything further. For designers who are not using sketch or website owners who don’t know what Sketch is, it is the premier design tool for website designers, and many agree Sketch is a superior program to Photoshop. If you’re a website owner who doesn’t do any design work, why should you care about Sketch? Sketch is the new standard of website design and it is a faster tool for creating designs. I can make websites faster in Sketch than I can in Photoshop and once you start using Sketch it is impossible to use Photoshop again to design websites. Sketch is also extremely fast and easy to make website wireframes and layouts with before you apply a design. No doubt there are amazing website designers out there still using Photoshop, but when I know a designer is using Sketch, I know they are  an up-to-date designer. I treat it like a filter for talent. As much as I use Sketch as a filter for finding good UX designers, I think by the end of the year more and more designers will be using Sketch. Therefore, using Sketch as a keyword filter for finding talent will become less relevant. One thing to keep in mind is that Sketch is available only for Apple computers (aka Macs) and most likely won’t be available on other operating systems anytime soon. By limiting yourself to only Sketch designers, you would be cutting off a massive part of the world that uses Windows. Many poorer countries have amazing designers that just can’t afford a Mac. Furthermore, Sketch designers are probably going to cost you more than what’s available in the global workforce of Photoshop designers. Tip: When searching for designers or posting a job, mention Sketch as a required skill. You’ll filter out a lot of designers with sub-standard portfolios.   Put mobile UX first Just making a website responsive is not good enough anymore. Even I have been guilty of making a desktop website first, with mobile as an afterthought and telling programmers how things should work on a mobile phone. For most webmasters and operators, mobile can’t be ignored anymore, especially with casinos having three times more mobile players than desktop users. Betting on sports? That should be done on a phone. Lottery tickets? The process of buying a lottery ticket will be mainly a mobile thing. Knowing how important mobile is, it is important to map out the entire user experience for mobile users and put more emphasis on your mobile design than you do for your desktop design. With design tools like Sketch, it makes it much easier to have your mobile designs alongside the desktop version — so your only excuse for not doing mobile wireframes and designs would be laziness.
Examples of typography that will negatively impact your website include too many types of fonts used, too light of a font on a white background, similar fonts and backgrounds with too little contrast, and line spacing that is too large or too small
If you want to take your mobile user experience to the next level, you can prototype the entire experience with one of the numerous prototyping tools that exist. Although these are tools I haven’t used yet, I have seen them touted as critical tools for mobile design and for creating layouts. These tools have come out of nowhere and they make mapping out your wireframe, layout and testing faster than previously possible. You could save your designers and programmers a lot of time by being able to provide an answer to how your entire mobile user experience should be. One tool that is receiving a lot of praise is proto.io. Typography matters You may wonder if typography is really that important. It is more important than you think and affects everything you do every day, including reading this article. Typography covers the choice of font, font colour, font size, typeface, line spacing and even line length. Imagine if everything you read had ONLY this choice of font. You’d struggle to read emails, do anything on your phone and have problems driving or finding your way through London. If you start adjusting all of these aspects of your CSS for your website, you will definitely influence your website metrics such as bounce rate, time on site and pages per visitor.  The reality is there are many website designers who don’t understand the rules of typography and don’t have any knowledge of how it can positively or negatively influence a website. When hiring a designer, it’s a good idea to ask if they include in their designs or have examples of typography UI kit in their portfolio. If they don’t have a good answer on their typography preferences, it means they probably haven’t studied it or don’t care enough about it. Some examples of typography that will negatively impact your website include too many types of fonts used, too light of a font on a white background, similar fonts and backgrounds with too little contrast, and line spacing that is too large or too small. To learn a bit more about typography check the Wikipedia (https://en.wikipedia. org/wiki/Typography) page for it, which ironically enough is one of the best examples of typography that everyone takes for granted.  Tip: When hiring a designer, ask if they include in their designs or have examples of typography UI kit in their portfolio. If they don’t have a good answer on their typography preferences, it means they probably haven’t studied it let alone care for it.

UX-casino-design_0.PNG

Content marketing and formatting Maybe content marketing is a bit of a distraction from the point of this article, but if you are going to make the effort of making a site look good, make sure you also put effort into the quality of the content. A good design is no mask for poor content. Good content doesn’t always have to be a lot of words, but usually it is, with articles exceeding 1,000 words. For some people that initial impression always makes a big difference. Giving your  users a summary of your content with hotlinks and breaking things down into lists is what can elevate your content and make it more effective. Just hitting your users with long paragraph after paragraph doesn’t make your content inviting enough for people to read and stay on your page. Their decision to read it all or not happens quickly. This takes us on to formatting your content. This is something that many websites totally miss the mark on. Your site metrics such as bounce rate, time on site and pages per session will all be influenced by the formatting of your content. Imagine Wikipedia without formatting, it would be a nightmare to use and wouldn’t be the site it is today. Here is a quick checklist for your content formatting:
  • Headlines
  • Images or video
  • Bold, italics and underline
  • Internal links
  • List
It takes time to write a good article and it takes even more time to add in all the formatting. This means breaking your content into sections using headlines and sub-headlines, using images and/or videos to enrich the content. Using bold, italics and underline helps to accent the important parts of your paragraphs.  If there is one single thing you can do to help yourself then it is adding internal links for your articles. Putting aside the SEO arguments, if you add more internal links and don’t go overboard, you help  users find more content on your website that would be of interest. It’s up to them if they want to click on a link. However, statistics show that users are more likely to click on links when available, and that  means more time on your site and more pages for them to visit rather than leaving them high and dry and bouncing away. Watch out for trends and fads Two fads I’ve seen come and go were the use of video backgrounds on websites and parallax scrolling. Some prominent gaming sites like PokerStars and a few others adopted these between 2014 to 2016 but they don’t seem to use them anymore. My guess is that they realised they looked cool but didn’t perform well. If you look up the big name companies that used these in the past, you’ll struggle to find any continued use of them. In addition to adding more for a user to download and slowing down the website, my assumption is that part of the problem was that video is a distracting element. The video would get users to watch what was happening but it was without sound and not much in the way of text. The call to action becomes the furthest thing from their mind and you have a site that probably underperforms compared to one with a static image. Regarding parallax scrolling sites, these were trendy in the past few years and you might see some examples of this on affiliate programme pages. They might be great to use if you are a design agency but I don’t think they have much practical purpose. Ultimately, these have the same issue as the video background website — it impresses users, but at the expense of losing them from making the next step of signing up or getting to the next page. 

UX-affliate-portal.PNG

The good and bad of affiliate sites Every so often I get asked for help on a website or network of websites that were once shining stars but have fallen from grace. I have also seen the evolution of some affiliates and their network of websites. Many years of experience have given me enough insight to see what I think is important for affiliates to focus on for this year and beyond. So here is my take on what some affiliates are either not doing right — or at all — and what others are doing that makes them more competitive.   Sinking fast:
  • Non responsive websites
  • Slow loading websites
  • Sites with thin content
On the rise:
  • Fresh designs
  • Fast loading websites
  • Enhanced content
If your website isn’t mobile ready then expect it to fade away. Slower loading websites are going to struggle to outrank faster loading websites. Not only is this an SEO problem, but slow loading websites will  lead to lower sales, higher bounce rates and less page views. Sites with thin content are eventually going to be outranked by sites with richer content. By richer content, I’m not just talking about better researched articles and pages that are at least 1,000 words long, but also content that is well formatted with more images and videos. It helps to work smart but this all comes down to who hustles the most. If your competitor is creating better content, and more of it, then they might be winning a slice of the pie at your expense. 
Just hitting your users with long paragraph after paragraph doesn’t make your content inviting enough for people to read and stay on your page. Their decision to read it all or not happens quickly
How to design well on a budget If you are an affiliate, it’s nice to know you can pull off a well-designed site on a budget by using a content management system (CMS) such as WordPress or Ghost. Both provide free software and there are many additional free templates which you can use. If you want to use a paid template, these can vary in price but remain affordable, from only USD $20 to $50. You can find good Ghost templates at marketplace.ghost.org and WordPress templates at wordpress.org/themes. There is also a large supply of free themes at github.com. Simply search for the CMS you use and you’ll find numerous free templates you can download and use. If you are looking for a better design you can find numerous themes for either CMS at themeforest.net. Finding a UX Designer If you have a budget and want a custom designed website then your job should be finding the right UX designer. Good places to find talented designers include: Dribbble.com, Upwork.com and adventures.io. Dribbble.com: Dribbble (not a typo, there are three b’s) is one of the most popular websites for designers to showcase their work. Here you’ll find talented designers that make logos, website designs and graphic design. You can use the site to type in any keyword like logo, casino or UX and you’ll find all sorts of images with these tags and the designers that made them. Upwork.com: Upwork is probably the biggest freelance site around. You can post a job looking for UX designers or you can search for candidates. If you want great designers, search keywords and categories for UX, user experience design and maybe throw in Sketch as a keyword if you want designers who use Sketch. adventures.io: What’s an article without a shameless plug? If you need a designer, we can help and whatever the budget is, we can find  a solution.  Tip: By specifically searching for a UX designer rather than a website designer, you are going to notice a different  skillset of applicants. Some website designers might not know what UX stands for and you don’t want these people. A designer will make your website how you ask for it, a good user experience designer will challenge you and ask tough questions to solve a problem to help your users.  Is it time for a new design? Look at the four casino portals listed below, all of which were redesigned in 2016, and this should give you enough reasons to consider having your site redesigned. CASE STUDY: THEPOGG.COM Thepogg.com had a large number of pages that lacked formatting. Hundreds of pages were updated to improve the readability and user experience and the improvements recorded were a 4% drop in the bounce rate, an improved average session duration of over 50 seconds and an increased pages per session by 0.65 pages per session.  Whether you are creating a new website, redesigning it or rejigging just a part of it, every time you do this there’s a chance to test what is working and what isn’t working. Your designs should be an evolution of your site. It shouldn’t take long for you to realise whether or not your new designs are performing better than previous versions.   

Subscribe to the iGB Affiliate newsletter